img tegi

img tegi surat döredýär. Surata ýol src atributynda görkezilýär. Ýapyjy teg talap etmeýär.

Atributlar

Atribut	Düşündiriş
`src`	Surata ýoly görkezýär. Hökman bolmaly atribut.
`alt`	Alternatiw tekst, surat tapylmadyk ýagdaýynda (meselem, ýoly nädogry görkezilen bolsa) onuň ýerine görkeziler. Hökman bolmaly atribut. Onuň ýoklugynda walidator (HTML ýa-da CSS-iň dogrulygyny barlaýan programma) nädogry diýip hasaplar.
`width`	Suratyň ini, pikselde (bu ýagda ölçeg birlikleri görkezilmeýär) ýa-da suratyň ata-enesiniň göteriminden.
`height`	Suratyň beýikligi, pikselde (bu ýagda ölçeg birlikleri görkezilmeýär) ýa-da suratyň ata-enesiniň göteriminden.

Nýuanslar

Eger surat üçin ini hem, beýikligi hem görkezilmedik bolsa - surat öz hakyky ölçeginde bolar. Eger beýikligi görkezilen bolsa - surat görkezilen beýiklikde bolar, ini bolsa proporsiýalary bozulmaz ýaly edip üýtgeriler.

Eger diňe ini görkezilen bolsa - şuňa meňzeş, surat beýikligi boýunça proporsiýalary saklap üýtgeriler.

Eger ini hem, beýikligi hem görkezilen bolsa - suratyň proporsiýalary bozulyp biler (ýa-da bolmasa, şonuň ýaly-da bolar). Eger ini ýa-da beýikligi (ýa-da ikisi bilelikde) hakyky ölçeginden uly bolsa - surat ulalýar, ýöne hilinden aýrylýar.

Suratlara ini we beýikligi atributlarda görkezmek maslahat berilýär (CSS arkaly däl) - bu ýagda brauzer şekilleri has çalt ýükler - onuň her suraty alylandan soň onuň ölçegini hasaplamaga zerurlygy ýok.

Hakyky suratyň ölçeglerini zerurlyk ýok bolsa kiçeltmek maslahat berilmeýär. Meselem, suratyň hakyky ölçegi 1000 1000 piksel, ýöne siz oňa ini 100px görkezersiniňiz. Bu ýagda ekrandaky surat 100 piksel görüner, ýöne tutuş müň üçin ölçege eýe bolýar we, şonuň ýaly, has uzak wagta ýüklenýär.

Mysal

Geliň saýda surat goşalyň we height we width atributlaryny görkezmeýäliň. Surat öz hakyky ölçeginde bolar:

<img src="monkey.png" alt="maýmyn">

Mysal

Geliň surata ini width atributy arkaly goşup göreliň, beýiklik bu ýagda suratyň proporsiýalaryny saklamak üçin üýtgemeli:

<img src="monkey.png" width="200" alt="maýmyn">

Mysal

Indi bolsa geliň surata beýikligi height atributy arkaly goşalyň, ini bu ýagda suratyň proporsiýalaryny saklamak üçin üýtgemeli:

<img src="monkey.png" height="100" alt="maýmyn">

Mysal

Geliň surata bir wagtda hem beýikligi, hem ini goşalyň. Suratyň proporsiýalary bu ýagda bozulmaly (hökman däl, ýöne bu ýagda beýiklik we ini proporsiýalaryň bozulmagy üçin saýlanan):

<img src="monkey.png" height="100" width="300" alt="maýmyn">

Mysal

Geliň surata nädogry ýol görkezeliň (ýönekeýleşdirmek üçin ony boş goýalyň). Suratyň ýerine biz alt atributynyň mazmunyny göreris (adaty tekst ýaly görünýär - ýöne ony kopiýalamaga synanyşyň - hiç zat bolmaz, ol surat ýaly çekiler):

<img src="" alt="maýmyn">

Şeýle-de görüň

width aýratynlygy,
elementiň ini görkezýär
height aýratynlygy,
elementiň beýikligini görkezýär
figure tegi,
surat we olaryň taglymlaryny birikdirýär
figcaption tegi,
surata taglym görkezýär
background-image aýratynlygy,
fon suratyny görkezýär