1. Sākums
  2. Dokumentācija
  3. HTML un CSS pamācības – kā izveidot mājas lapu bez priekšzināsanām 2020
  4. Kā ievietot attēlu HTML mājas lapā?

Kā ievietot attēlu HTML mājas lapā?

kā ievietot attēlu mājas lapā htmlLai ievietotu attēlu HTML dokumentā, izmanto nepāra tagu <img>, pievienojot atribūtu src (source), kas norāda ceļu uz bildes atrašanās vietu.

<img src='images/zieds.jpg'>

Ievietojot attēlu HTML dokumentā, jānorāda arī alternatīvais teksts (tas izdarāms ar atribūtu alt). Alternatīvais teksts ir teksts,kas tiks parādīts, ja bilde kādu iemeslu dēļ nevarēs tikt attēlota interneta pārlūkā. Kā arī speciāla programmatūra, kas nolasa tekstu no tīmekļa vietnes koda, nolasīs alt tekstu (tādas programmas izmanto,piemēram, neredzīgie).

<img src='ceļs uz attēla atrašanās vietu(url)' width='945' height='707' alt='alternatīvais teksts' title='nosaukums'>

<img src='images/zieds.jpg' width='945' height='707' alt='lillijas zieds rozā krāsā' title='Lillijas zieds'>

Kā arī alt ir nepieciešams norādīt priekš SEO, lai meklētājservisi saprot par ko ir attēls. Jānorāda arī title – attēla nosaukums, kas arī ir svarīgi priekš SEO.

Ja attēls atrodas tajā pat mapē, kur dokuments, kurā ievietojat attēlu, tad pie source variet norādīt tikai attēla nosaukumu, piemēram attelanosaukums.jpg vai attelanosaukums.png. Ja attēls atrodas tajā pat vietā, bet iekš mapes, piemēram, mapē “images”, tad norādiet images/attēlanosaukums.jpg. Ja attēls atrodas kādā citā mapē, tad norādiet pilno ceļu līdz attēlam, piemēram, file:///Users/user/Desktop/attelanosaukums.png. Pilno ceļu līdz attēlam Jūs variet iegūt nospiežot labo peles pogu uz attēla un izvēloties Open with — Google Chrome vai Firefox vai Safari (vai jebkuru interneta pārlūku ko izmantojat). Interneta pārlūka adreses joslā būs redzams ceļš:Ceļa atrašana uz attēlu

Paturpināsim, ar iepriekšējā pamācībā izveidoto HTML dokumentu  un papildināsim to ar attēlu:


<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>Mana pirmā mājas lapa - Mana lapa</title>
<meta name="description" content="Šeit jāievieto meta apraksts par Jūsu mājas lapu.Šī info tiek attēlota meklēšanas rezultātos.">
</head>
<body>
<h1>Par mani</h1>
<img src='lotus.jpg' width='945' height='707' alt='lotuss' title='Lotus'>
<p>Es izstrādāju savu pirmo mājas lapu. Šis ir mans pirmais paregrāfs.</p>
</body>
<footer>
Izstrādāts 2020
</footer>
</html>

Attēla ievietošana html dokumentā

Vai šis raksts Jums noderēja? 3

Sazinies ar mums!