እንደ ኤች ቲ ኤም ኤል አንድ ምስል ግራፊክ, ዳራ ያስገቡ. በኤች ቲ ኤም ኤል ውስጥ ምስል በኮምፒተር ውስጥ, በመሐከል, ወደ ጠረጴዛ እንዴት እንደሚገባ

ከጣቢያዎች ጋር በሚሰሩበት ጊዜ የሚታየው ክፍል በጣም አስፈላጊ ከሆኑት ውስጥ አንዱ ነው. በእርግጥ, ከተግባራዊነቱ ያነሰ ነው ነገር ግን ሊወገድ አይገባም. ከኮምፒዩተርዎ ወደ ጣቢያዎ የ HTML ምስል እንዴት እንደሚጭኑ እስቲ እንወያይ. ለዚህ አንድ አማራጭ ሊቀርብ ይችላል ወይስ ጥቂት? አንድ ምስል እንዲገባ በ HTML ውስጥ እንዴት ሌሎች ሰዎች እንዲያዩት? መጠቀሚያ ምንድነው - ኮምፒተር ወይም አገልጋይ?

HTML ምንድን ነው?

የፅሁፍ ጥቅሶችን ለማመሳጠር ቋንቋ - ይህ የአረፍ-ቃላት ስልት ነው. በእሱ እርዳታ የወደፊቱ የጀርባ ቦርዱ ይመሰረታል, ዋና ዋና አካላት መቀመጫ በመከናወን ላይ ነው. ከዚያም የውሂብ ሽግግር ኃላፊነት ኃላፊ የሆኑ የውሂብ ሉሆች እና በ ፋይሎች ወርድ ላይ አስቀድሞ የተዋቀሩ ናቸው. ነገር ግን በማናቸውም ገፅታ ልብ ውስጥ HTML ነው. በመንገዶቹ አማካኝነት ምስሎቹ ተስተካክለዋል. በሌሎች መንገዶችም ማድረግ ይችላሉ, ነገር ግን አንድ ቀላል ነገር ለምሳሌ የመጀመሪያ ስዕል መጫንዎን ማረጋገጥ ከፈለጉ, ከዚያ ይጠቀሙበት. እና አሁን ወደ ኤች ቲ ኤም ኤል ምስል እንዴት እንደሚገባው ወደ ጥያቄ እንሸጋገራለን.

የ img መለያ መጠቀም

ግራፊክስን መጠቀም እንጀምራለን. ወደ ኤችቲኤምኤል ሰነድ የጀርባ ምስል እንዴት ማስገባት እችላለሁ? እና በመጀመሪያ ደረጃ, ፋይሉን እንደ የገጽ ነገር ማስገባት ማለት ነው. ለእንደዚህ ዓይነት ተጨማሪ, img ጥቅም ላይ ይውላል. ይህ መለያ የመተካት ይዘት ያለውበት የመስመር ንጥል ነው. ለትክክለኛ ጽሑፍ ምልክት አራት ክፍሎች ብቻ ይይዛሉ. አንደኛው src, ቁመት, እና ስፋት ሲሆን በኋላ ላይ ይገለፃሉ. ሌሎቹ ሶስት ነጋዴዎች, መካተቱ (የማህደረ መረጃ ይዘት ለማካተት) እና iframe (የእሳት አጠቃቀም) ናቸው. መለያው የበጣም ቁንጽል የሆነ ነገር ያደርገዋል. ብቸኛ ልዩነት ውጫዊ ይዘት ጥቅም ላይ እየዋለ ነው, ይህም የሚታየው. በዚህ ጉዳይ ላይ, የሶስተኛ ወገን ፋይል ሊኖር ይችላል, እሱም በእርግጥ ይጫናል. የበስተጀርባ ምስል ወደ ኤች ቲ ኤም ኤል እንዴት ማስገባት እንደሚገባ ጥያቄ ካለዎት, ማኖር ይሻላል. ምክንያቱም ምስሉ የሚታየው ኮምፒተር ራሱን በራሱ በሚሠራበት ጊዜ ብቻ ነው.

የ src መለያዎችን መጠቀም

ስለዚህ, ወደ ኤችቲኤምኤል ምስል እንዴት የግራፊክ ምስል እንዴት እንደሚገባ ጥያቄ ላይ እየሰራን ነው. ሊጫን የሚገባውን ምስል ዱካ ለመለየት, src ይጠቀሙ. የአጠቃላይ ዕቅድ እንደሚከተለው ነው-ይህንን ባህርይ, እኩል እድል እና አድራሻውን መወሰን አለብዎት.

አንዴ ኤችቲኤምኤል በሚተነተን ጊዜ አሳሽ ወደ መለያው ሲደርስ ወዲያውኑ, የነዘር ንጥል ይታያል. በእሱ ውስጥ ነው እና ውጫዊ ፋይል ይጫናል. መንገዱ ምንም አይነት ስህተቶችን መያዝ የለበትም, ምክንያቱም በእሱ ላይ የሚሰራ ፕሮግራም ነው. እና እርሷ ፋይሉን ካላገኘች, የስህተት አዶ ይታያል, እሱም በጣም የሚያምር ሆኖ የማይታይ ነው. ወደ ኤች ቲ ኤም ኤል ሰነድ ሰንጠረዥ እንዴት አንድ ምስል ማስገባት እችላለሁ ? በተፈለገው ህዋስ ውስጥ ሁሉንም አስፈላጊውን ኮድ መፃፍ አስፈላጊ ነው.

ምስሉን በአገልጋዩ ላይ ማዋቀር: ቁመት እና ስፋት በ img መለያ

ስለዚህ በኤች ቲ ኤም ኤል ምስል እንዴት እንደሚገባ እናውቀዋለን. አሁን እንገመግመዋለን, እንዴት ማዋቀር እንደሚቻል. ፋይሉ ለኮምፒዩተር ኮምፒዩተሩ እንደወረደ ወዲያው የፎቶው መጠን ወዲያውኑ ይወሰናል. እና የመጀመሪያ ግቤቶችዎ ከሚፈልጉት ጋር የማይጣጣሙ ቢሆንስ? በዚህ ሁኔታ, ቁመትና ስፋት መለኪያዎች (በፒክሴል የተጠቆሙት) ሊረዱ ይችላሉ. በዚህ ጊዜ ኮዱ እንደሚከተለው ይፃፋል-መጀመሪያ src ና የፋይል አድራሻ. ከዚያም ተመሳሳይ ንድፍ ስፋትን ይጠቁማል, እና ስፋቱ ምን መሆን አለበት. የመጨረሻው ቁመት እና ቁመት ነው. የድር ባለሙያዎች ብዙውን ጊዜ እንዲህ ዓይነቱ ስህተት ያደርሳሉ: ትልቅ ፋይሎችን ለአገልጋዩ ይሰቅላሉ, ማለትም ብዛት ያላቸው ሜጋባይት. ዱካ የታዘዘ ሲሆን ምስሉ በተፈለገው መጠን ላይ ተስተካክሏል. በውጤቱም ተጠቃሚው ትንሽ ምስል እንዴት በዝግታ እንደተጫነ ማየት ይችላል. ይህ ውጫዊ ውጫዊ ገጽታ አይደለም.

ምክሮች ለስራ

አሉታዊነትን ለማስወገድ, አስቀድመው የምስሉን መጠን ይቀንሱ. ለማራኪ መልክ ያለው የትኞቹ መለኪያዎች እንደሚያስፈልጉ እርግጠኛ ካልሆኑ, አንድ ቅጂ ይፍጠሩ እና በርሱ ይሞክሩት. በተጨማሪም ክብደትን ለማሻሻል ክብካቤ መውሰድ ያስፈልጋል. ወደ ሌሎች ቅጥያዎች በማስተላለፍ ወይም ልዩ የመስመር ላይ አገልግሎቶችን እና ፕሮግራሞችን በማስተላለፍ የግራፊክ ፋይሎችን ያለ ጥራት ጥራቱ መቀነስ አስፈላጊ ነው. በጣቢያው ላይ ብቻ ሳይሆን በድር አስተዳዳሪም ይደነቃል - እንደነዚህ ያሉት ፋይሎች በፍጥነት ይጫናሉ እና በማስተናገድ ላይ ያነሰ ቦታ ይወስዳሉ.

የምዝገባ ችሎታዎች ምሳሌ

ወደ ምስሉ የሚወስደውን መንገድ እንዴት እንደሚጻፍ እንመልከት.

1. አንድ የፋይል ስም.

2. በአንድ አካባቢያዊ ኮምፒተር (አገልጋይ) ላይ የሚገኝ የምስሉ አድራሻን ይጥቀሱ.

3. በሌላኛው አስተናጋጅ ወደተቀመጡት ቦታ ዝርዝር ዱካ.

ከመጀመሪያው ነጥብ ምሳሌውን ሲጠቀሙ, ምስሉ ልክ እንደ ምስሉ በተመሳሳይ ማውጫ ውስጥ መሆን አለበት. ሁለተኛው ስፍራ አሁን ካለው ገጽ ጋር አንጻራዊ ንኡስ ፊደል ነው. ሦስተኛው ምሳሌ የተፈለገውን ምስል የሚገኝበት ትክክለኛውን ዱካ ይገልጻል. በሁለተኛው ውስጥ, ምስሉ በማንኛውም አገልጋይ ላይ ሊገኝ እንደሚችል (ይህ አጠቃቀም በ .htaccess ፋይል ውስጥ ካልተከለከለ). ይሁንና, ከተወገደ, በጣቢያዎ ላይ ያለው ምስል ይጠፋል. የኤችቲኤምኤል ልዩነት የማረጋገጫ ሰነዱ ራሱ ብቻ ነው, እና ሁሉም ነገር ከሶስተኛ ወገን አገልጋዮች ሊጫኑ ነው. እነዚህ ዘዴዎች የማውረድ ፍጥነት ለመጨመር የሚያገለግሉ ሲሆን (ግን እዚህ ውስጥ እንዴት መጠቀም እንደሚቻል ማወቅ አለብዎት).

Alt እና title to img?

አንድ ግራፊክ ፋይል በሆነ ምክንያት በኤችቲኤምኤል ሰነድ ውስጥ ካልተጫነ ምን ማድረግ አለብኝ? አንድ የተሳሳተ ዱካ ወይም ሌላ ነገር ካለ, alt ባህሪን መጠቀም አለብዎት. የተቀረውን ምስል ተወካይ ተግባር ያከናውናል. መርሃግብሩ አይጫንም እንበል. ግን አሳሹ በምስሉ ስር ያለውን ቦታ አሁንም ያዋቅራል. በተጠቃሚዎች ጭነት ሲጠብቁ አስፈላጊ ነው, እና ፕሮግራሙ የጊዜ ሰሌዳውን ለመቀበል ዝግጁ መሆኑን ለማሳየት አስፈላጊ ነው.

ተያያዥ ጽሑፍን ለማሳየት, ልዩ የርእስ ባህሪን ተጠቀም. በእውነቱ, ይህ ጠቃሚ ምክር ነው, እና ለየትኛውም የኤችቲኤምኤል ኮድ ክፍል ሊጠቀሙበት ይችላሉ. ይህ ጥሩ ነው, ምክንያቱም የተወሰኑ ነገሮችን ለማብራራት ያስችለናል. በዚህ ንዑስ ርዕስ ያሉትን ሁለቱን ባህሪያት መጠቀም ከላይ እንደሚከተለው ነው: ከላይ ወደ ምሳሌነት, ከቁጥር በኋላ, alt ን መጀመሪያ ላይ ታክሏል, ከዚያም ርእስ.

እና እነዚህ ባህሪያት ለጎብኚዎች ምቾት ለመፍጠር ብቻ አይገለሉም. የጣቢያው ማስተዋወቂያ በጎ ተጽዕኖ ይኖረዋል. ስለዚህ, ለእዚህ ለተመረጡ ቁልፍ ቃላትን ይጠቀሙ. ይሄ የፍለጋ ፕሮግራሞች ውስጥ የጣቢያዎች እና የፍለጋ አገልግሎቶች ደረጃ አሰጣጥ ደረጃውን ለማሻሻል ያግዛል . ነገር ግን በሁሉም ነገር ጠንቃቃና ምክንያታዊ መሆን አለብዎ.

ስዕሎችን አሰልፍ

ለባሎች, እና በአጠቃላይ ሁሉም የማሳወቂያ ቋንቋዎች 4 ክፍሎች, ከዚህ ቀደም የተጠቀሱትን, የአተገባበር አሰራር እንዲተዋወቅ ተደርጓል. በመሠረቱ ሥዕሉ የሚገኝበትን ቦታ መቀየር ይችላሉ. በነባሪነት ከቅጥሉ ጠርዝ ጋር የተገጣጠመ ነው. ለዚህ የታችኛው ክፍል ተጠያቂ ነው. እና እንዴት ማድረግ እንደሚቻል? ይህ ከፍተኛ ነው. በተግባር ግን እንደሚከተለው ይሆናል: የምስሉ አድራሻ በሚተይበት ቦታ src ባስቀመጠው መሠረት የንብረት አሰላለፍ አመላካች እና እሴቱ አክል.

ምስሉ የሚገኝበት መስመር ላይ, ከላይኛው ጫፍ ላይ ይጣመራል. ምስሉን በማእከሉ ውስጥ ለማስገባት በኤችቲኤምኤል እንዴት ነው? አንድ ተጨማሪ የመቃኘት ዕድል - መካከለኛ. በእሱ አጠቃቀም ላይ ምንም መሠረታዊ የሆነ ለውጥ የለም. ይህን ኮድ ከተጠቀሙ ምስሉ በመካከሉ ይሰረዛል. በተጨማሪም በስዕሉ ዙሪያ ያለውን ጽሑፍ ማብራት ይችላሉ. ይህንን ለማድረግ የቀኝ እና የግራ ባህሪያት ተግባራዊ ይሆናሉ. በዚህ ጊዜ ምስሉ "ተንሳፋፊ" ይሆናል. ወደ ግራ ማካካሻው ከሌሎች የፊደል ልዩነቶች ጋር ተመሳሳይ ነው. ትክክለኛውን መጠቀም ደግሞ ምስሉ በቀኝ በኩል ስለሚቀመጥበት ልዩነት ተመሳሳይ ውጤት ያስገኛል. የእነዚህ መመሪያዎች ትግበራ የራሱ የሆነ ባህርይ አለው. ስለዚህ ችግሩ ችግሩ ከምስሉ ቅርብ በመሆኑ ነው. በዚህ ምክንያት, ለዓይን የማይመች የማጣበቅ ችሎታ ይፈጠራል. ነገር ግን ይህንን በንጥርብል ቅጥ ሉህ ወይም በኤችቲኤም ኮድ ማስተካከል ይችላሉ. የእነዚህ ለውጦች የ vspace እና hspace ባህሪያትን ይጠቀሙ. የመጀመሪያው የመግቢያውን ከላይ እና ከላይ ያሉትን, እንዲሁም ሁለተኛው - ከቀኝ እና ከግራ በስተቀኝ ይገልጻል.

ዳራውን ማዘጋጀት

እንዴት ምስል ወደ ጣቢያው ኤችቲኤምኤል እንዴት እንደሚገባው? የዚህን ግብ ለማሳካት የጀርባው ባህርይ በጣም ጠቃሚ ነው. የአካል ክፍሉ አካል ነው. ዓላማው ወደ ግራፊክ ፊደል መሄድን ለማሳየት ነው, ይህም አንድ ገጽ, ጠረጴዛ ወይም የተለየ ህዋስ መሙላት አለበት. በተግባር ውስጥ, አጠቃቀሙ ከዚህ በታች ይመስላል: የምስሉ አድራሻ ቀድሞውኑ እንደ አካላዊ ቅርፅ ግቤት እሴት ይፃፋል. በዚህ መንገድ የተቀመጠው የበስተጀርባ ምስል ከ በላይኛው የግራ ጥግ ይጀምራል. ከዚህ በፊት እዚህ ጋር የተተከለው ከሚከተለው ጋር ነው. አንድን ነገር አንድ ቀለም ብቻ መሙላት እና ምስል አለመጠቀም ከሆነ ይህን የመሰለ አጭር መግለጫ መጠቀም ይችላሉ-ጋማ ቁጥሩ ለባሽ (bgcolor) መመጠኛ (ባጊሌት) የግቤት ባህሪይ ነው. ጥቃቅን ለውጦች ተደርገዋል. እንደሚመለከቱት, የ bgcolor ባህሪ አስቀድሞ ጥቅም ላይ ውሏል. ለእዚህ, ገጹ ላይ ወይም ክፍሉ የሚሞላው ቀለም ብቻ ነው. ከጀርባዎ እንዲሆን እና ቀለሙን ለመቀየር ከኮምፒውተርዎ ወደ ኤች ቲ ኤም ኤል እንዴት አንድ ምስል ማስገባት እንደሚችሉ እነሆ. በአጠቃላይ, ኤችቲኤምኤል ሙሉ በሙሉ ለመርዲት, ለአንድ ሳምንት ጊዜ ያህል መስጠት በቂ ነው, እና በበቂ ምክንያት ይበቃል.

ማጠቃለያ

ኤች.ቲ.ኤም.ኤል ሙሉ ለሙሉ ያልተጠናቀቀ የፕሮግራም ቋንቋ መናገር አይችልም ነገር ግን አንድ ድር ጣቢያ በመፍጠር ረገድ በጣም ከፍተኛ ዋጋ አለው. እሱ እውነተኛ አጽም ነው. እናም አሁን በድግግሞሽ እና በጣቢያን ስዕሎች እንዴት መስራት እንዳለብዎ እና ከእነሱ ጋር አገናኞችን እንደሚያያይዙ በእርግጠኝነት መናገር እንችላለን. ስለዚህ ለኤም.ኤስ ምስል ምስል እንዴት ማስገባት እንደሚገባ ጥያቄው ግልጽ መሆን አለበት.