Lai ievietotu dokumentā attēlu, tiek izmantots <img /> tags.

Piemērs:

<img src="http://exs.lv/bildes/demo.jpg" alt="Demo attēls" />

Rezultāts:

src norāda atrašanās vietu. Tā var būt gan absolūtā, gan relatīvā attēla adrese. Relatīvā adrese nozīmē faila atrašanās vietu attiecībā pret HTML dokumentu. Ja bilde atrodas tajā pašā mapē, kur HTML dokuments, relatīvā adrese ir vienkārši nosaukums.jpg, bet, ja bilde tiek ievietota mapē "atteli", relatīvā adrese ir atteli/nosaukums.jpg. Savukārt absolūtā adrese ir faila atrašanās vieta attiecībā pret mājas lapas sākuma mapi, jeb viss ceļš aiz domēna vārda. To sāk ar / simbolu.Ceļu var norādīt arī rakstot pilno URL adresi http://adrese.lv/mape/attels.jpg bet tas nav obligāti, ja attēls atrodas uz tā paša domēna, kur HTML fails.

Šim tagam iespējams pievienot vairākus papildus atribūtus, no kuriem obligāts ir alt jeb alternatīvais teksts. Attēls parādīsies arī bez šī atribūta, bet ir svarīgi pierast pie tā lietošanas. Alt atribūts norāda tekstu, kas parādīsies attēla vietā gadījumā, ja attēlu kaut kāda iemesla dēļ nevarēs parādīt, kā arī palīdz meklētājiem noteikt, kas redzams attēlā.

<img /> ir nepāra tags, tādēļ tas tiek noslēgts ar / tā beigās, nevis noslēdzošo tagu.

Attēla izmēri

HTML attēlam iespējams norādīt arī izmērus (platumu un augstumu). Šeit gan jāņem vērā, ka ir ļoti ieteicams mājas lapā ievietot attēlus, kuri jau iepriekš ir samazināti un nepieciešamajiem izmēriem izmantojot kādu no attēlu apstrādes programmām. Norādot atšķirīgu izmēru HTML kodā, mēs liekam attēla izmērus mainīt lietotāja pārlūkprogrammai, un šādā gadījumā var ciest attēla kvalitāte, kā arī neproporcionāli norādot izmērus, attēls var izskatīties saspiests vai izstiepts. Vēl viens iemesls lai attēlus samazinātu jau iepriekš, ir lapas ielādes ātrums. Lieli attēli parasti aizņem vairāk vietas un ielādējas lēnāk.

Izmērus norāda pievienojot attēlam width (platums) un height (augstums) parametrus. Tajos norāda skaitliskas vērtības (pikseļos) vai procentuālas, pievienojot % zīmi.

Piemērs:

<img src="bilde.jpg" width="200" height="160" alt="Attēls" />

Laboja Maadinsh, labots 4x

• HTML
• Attēli
• Linki
• Simulators
• Bildes
• 60 sekundes ar...
• Width
• Height