Spletna stran je sestavljena iz različnih elementov, na primer naslovov, odstavkov, slik, seznamov, tabel in povezav. V HTML te elemente opisujemo z oznakami, ki jih brskalnik prebere in na njihovi osnovi prikaže vsebino dokumenta.
Pomni: HTML element je navadno sestavljen iz začetne oznake, vsebine in končne oznake. Nekateri elementi pa so prazni in imajo samo začetno oznako.
Osnovna pravila
- HTML elemente opisujemo z oznakami, zapisanimi med znakoma
<in>. - Mnogi elementi imajo začetno in končno oznako.
- Nekateri elementi so prazni in nimajo končne oznake.
- Atribute zapisujemo znotraj začetne oznake.
- Vrednosti atributov je priporočljivo zapisovati v narekovajih.
- Za preglednost in sodobno prakso oznake in atribute zapisujemo z malimi črkami.
Primerjave
Elementi v paru in prazni elementi
Opis elementa je v splošnem sestavljen iz začetne oznake, vsebine in končne oznake. Tak zapis uporabljamo pri elementih, ki vsebujejo besedilo ali druge elemente.
<imeOznake> element strani </imeOznake>
Pri HTML ločimo dve osnovni vrsti elementov:
| Vrsta elementa | Opis | Primer |
|---|---|---|
| prazni elementi | nimajo vsebine in nimajo končne oznake | <br>, <hr>, <img> |
| elementi v paru | imajo začetno oznako, vsebino in končno oznako | <p>To je odstavek besedila.</p> |
Prazni elementi, imenovani tudi elementi brez vsebine, nimajo zaključne oznake. Med take sodijo na primer:
- oznaka za prehod v novo vrsto:
<br> - oznaka za vodoravno črto:
<hr> - oznaka za vstavljanje slike:
<img>
Elementi, ki nastopajo v paru, imajo začetno in končno oznako. Pri teh elementih velja, da se končna oznaka od začetne razlikuje po dodatni poševnici. Zgled para oznak:
- oznaka za izpis odstavka:
<p>To je odstavek besedila.</p>
Pozor: Prazni elementi nimajo končne oznake. Če jih zapisujemo, kot da imajo vsebino in zaključno oznako, zapis ni pravilen.
Dodatne lastnosti HTML oznak (atributi)
Večina oznak pozna dodatna pojasnila oziroma lastnosti. Zapišemo jih znotraj začetne oznake, tako da za imenom oznake dodamo presledek in nato atribut v obliki:
<imeOznake lastnost="vrednostLastnosti"> element strani </imeOznake>
Vrednost atributa običajno zapišemo med narekovaje. Čeprav so v nekaterih primerih možne tudi vrednosti brez narekovajev, je zaradi preglednosti in manjše možnosti za napake priporočljivo, da narekovaje vedno uporabljamo. Če v vrednosti nastopajo dvojni narekovaji, lahko uporabimo enojne narekovaje.
Zgled samostojne oznake z atributi:
<img src="moja_slika.gif" width="100" height="100" alt="Moja slika">
Primer uporabe enojnih narekovajev:
<img src="slika.gif" alt='Ta slika "prinaša" smeh'>
Če ima element več atributov, njihov vrstni red praviloma ni pomemben.
Pomni: Atribute zapisujemo v začetni oznaki elementa. Z njimi določimo dodatne lastnosti elementa, na primer izvor slike, alternativno besedilo ali velikost.
Primer HTML dokumenta
Koda HTML dokumenta, ki jo zapišemo v urejevalniku:
<!doctype html>
<html lang="sl">
<head>
<meta charset="utf-8">
<title>Ime strani</title>
</head>
<body>
<h1>Prvi naslov</h1>
<p>Prvi odstavek besedila.</p>
</body>
</html>
Če si primer ogledamo podrobneje, oznake pomenijo:
- oznaka
<!doctype html>je deklaracija, ki pove, da gre za dokument HTML - besedilo med
<html>in</html>opisuje celoten dokument HTML - besedilo med
<head>in</head>določa glavo dokumenta, kjer zapišemo metapodatke - oznaka
<meta charset="utf-8">določa kodiranje znakov dokumenta - besedilo med
<title>in</title>je naslov spletne strani, ki se običajno prikaže na zavihku brskalnika - besedilo med
<body>in</body>je vsebina spletne strani, ki jo prikaže brskalnik - besedilo med
<h1>in</h1>je prikazano kot glavni naslov - besedilo med
<p>in</p>je prikazano kot odstavek
Ko spletno stran zaženemo v brskalniku, ta izpiše:
Prvi naslov
Prvi odstavek besedila.
Priporočila
- Imena oznak, atributov in običajnih predpisanih vrednosti zapisuj z malimi črkami.
- Vrednosti atributov zapisuj v narekovajih.
- Pri elementih v paru vedno preveri, ali sta začetna in končna oznaka pravilno zapisani.
- Pri praznih elementih uporabljaj pravilen zapis brez zaključne oznake.
- Po spremembi kode datoteko shrani in stran v brskalniku ponovno naloži.
Pogoste napake
- Začetna in končna oznaka nista pravilno usklajeni.
- Prazni element je zapisan, kot da ima vsebino in zaključno oznako.
- Atribut ni zapisan znotraj začetne oznake.
- Vrednost atributa ni pravilno zapisana ali manjka.
- V dokumentu se mešajo nepregledni zapisi z velikimi in malimi črkami.