13 of 133 menu

Kichwa cha img

Kichwa img kinaunda picha. Njia ya picha inaandikwa kwenye sifa src. Haihitaji kichwa cha kufunga.

Sifa

Sifa Maelezo
src Inaweka njia ya picha.
Sifa ya lazima.
alt Maandishi mbadala, ambayo yataonyeshwa badala ya picha, kama haipatikani (kwa mfano, njia imeandikwa vibaya).
Sifa ya lazima. Kama haipo, validator (programu inayokagua usahihi wa HTML au CSS) italalamika.
width Upana wa picha, kwenye saizi za skrini (katika kesi hii vitengo havitaainishwa) au asilimia kutoka kwa kipengele mzazi cha picha.
height Urefu wa picha, kwenye saizi za skrini (katika kesi hii vitengo havitaainishwa) au asilimia kutoka kwa kipengele mzazi cha picha.

Nuances

Kama picha haijawekewa upana wala urefu - picha itakuwa na ukubwa wake halisi. Kama umewekewa urefu - picha itakuwa na urefu uliowekwa, na upana utabadilika ili uwiano wake usiharibike.

Kama upana pekee umewekwa - vivyo hivyo, picha itabadilika kwa urefu ili kuweka uwiano.

Kama upana na urefu wamewekwa - uwiano wa picha unaweza kuharibika (au la, utakavyokisia). Kama upana au urefu (au yote pamoja) ni mkubwa kuliko ule halisi - picha itakua, lakini itapoteza ubora.

Inapendekezwa kuweka upana na urefu wa picha kwenye sifa (na si kupitia CSS) - katika kesi hii kivinjari kitapakia picha haraka - hakuna haja ya kuhesabu ukubwa wa kila picha baada ya kuipata.

Haipendekezwi kupunguza ukubwa halisi wa picha bila lazima. Kwa mfano, ukubwa halisi wa picha ni 1000 kwa 1000 saizi za skrini, na wewe utaweka upana wake kuwa 100px. Katika kesi hii picha kwenye skrini itaonekana kwa 100 saizi za skrini, lakini itakuwa na ukubwa wa elfu nzima na, ipasavyo, itapakia kwa muda mrefu zaidi.

Mfano

Wacha tuongeze picha kwenye tovuti na tusiiweke sifa height na width. Picha itakuwa na ukubwa wake halisi:

<img src="monkey.png" alt="nyani">

:

Mfano

Wacha tujaribu kuongeza upana kwa picha kwa kutumia sifa width, urefu katika kesi hii unapaswa kubadilika ili kuweka uwiano wa picha:

<img src="monkey.png" width="200" alt="nyani">

:

Mfano

Na sasa wacha tuongeze urefu kwa picha kwa kutumia sifa height, upana katika kesi hii utabadilika ili kuweka uwiano wa picha:

<img src="monkey.png" height="100" alt="nyani">

:

Mfano

Wacha tuongeze wakati huo huo urefu na upana kwa picha. Uwiano wa picha katika kesi hii unapaswa kuwa umaharibika (si lazima, lakini katika kesi hii urefu na upana vimechaguliwa ili uwiano uharibike):

<img src="monkey.png" height="100" width="300" alt="nyani">

:

Mfano

Wacha tuweke njia isiyo sahihi kwa picha (kwa urahisi tuache iwe tupu). Badala ya picha tutaona yaliyomo kwenye sifa alt (inaonekana kuwa ni maandishi ya kawaida - lakini jaribu kuyaiga - hutafaulu, yatanaswa kama picha):

<img src="" alt="nyani">

:

Angalia pia

  • sifa width,
    inayoweka upana wa kipengele
  • sifa height,
    inayoweka upana wa kipengele
  • kichwa figure,
    kinachounganisha picha na maelezo yake
  • kichwa figcaption,
    kinachoweka maelezo ya picha
  • sifa background-image,
    inayoweka picha ya mandharinyuma
entrpteska