11 HTML atribuudid

HTML atribuudid

  • Kõik HTML elemendid võivad omada atribuute
  • Atribuudid pakuvad elementide kohta lisateavet
  • Atribuudid lisatakse elemendi algusmärgendisse
  • Atribuudid kirjutatakse enamasti kujul: atribuudi_nimi=”väärtus”

Kõik HTML elemendid võivad lisaks nimele omada ka atribuute, mis pakuvad elemendi kohta lisateavet. Mõnikord on need valikulised, aga mitmel elemendil on ka kohustuslikke atribuute. Atribuudid lisatakse elemendi algusmärgendisse kujul:

atribuudi_nimi="väärtus"

Nii võib mõni element olla kirjutatud järgmisel kujul:

<elemendinimi atribuut1="väärtus" atribuut2="väärtus"> Elemendi sisu </elemendinimi>

Lingi aadressi atribuut (href)

Lingid HTML koodis määratletakse <a> märgendiga. Lingi viide, kuhu kasutaja suunatakse, täpsustatakse href (hypertext refrence) atribuudiga:

<a href="https://ramkool.edu.ee">See on lingi tekst</a>

Linkide loomisest tuleb täpsemalt juttu hilisemas peatükis.

Allika atribuut (src)

Pildid HTML-koodis määratletakse <img> märgendiga. Pildi allikas ja failinimi täpsustatakse src (source) atribuudiga:

<img src="ramk_logo.png">

Alternatiivteksti atribuut (alt)

alt (alternative text) atribuuti kasutatakse juhul, kui mingil põhjusel ei saa kuvada veebilehele lisatud pilti. alt atribuudiga määratletakse alternatiivtekst, mida kuvatakse sellisel juhul pildi asemel. Sellest atribuudist on kasu ka vaegnägijatele, sest ekraanilugerid saavad pildi asemel vajadusel ette lugeda alt atribuudiga lisatud teksti.

<img src="ramk_logo.png" alt="Rocca al Mare Kooli logo">

Laiuse ja kõrguse atribuudid (width/height)

Piltidel võivad olla ka laiuse (width) ja kõrguse (height) atribuudid, mis määravad ära pildi laiuse ja kõrguse:

<img src="ramk_logo.png" width="300" height="100">

Laius ja kõrgus on vaikimisi määratud pikslites, seega laius = “300” tähendab 300 pikslit.

Stiili atribuut (style)

style atribuuti kasutakse elemendi stiliseerimiseks. Sellega saab muuta näiteks elemendi värvi, suurust, kirjatüüpi vms.

<p style="color:blue">See tekstilõik on sinist väriv</p>

Keele atribuut (lang)

Atribuut lang (language) on kasutusel tervel veebilehel või selle osades kasutatava keele deklareerimiseks! Keele deklareerimisest on kasu ekraanilugeritele ja otsingumootoritele.

Igas HTML dokumendis kasutatav keel tuleks deklareerida elemendi <html> algusmärgendis. Näiteks eesti keele deklareerimiseks kasutatakse lühendit et.

<!DOCTYPE html>
<html lang="et">
<body>
...
</body>
</html>

Pealkirja atribuut (title)

title atribuudi lisamisel elemendile kuvatakse kasutajale hiirega elemendi peale liikudes väikeses hüpikaknas title atribuudi väärtuseks kirjutatud tekst.

<p title="esimene lõik">Siin on tekstilõik</p>

Enesekontroll (3 küsimust)

Kokkuvõtteks

  • Kõik HTML elemendid võivad omada atribuute
  • Atribuudid kirjutatakse enamasti kujul: atribuudi_nimi=”väärtus”
  • href atribuut määrab ära viite, millele link kasutaja suunab
  • src atribuudiga määratakse ära pildi allikas
  • width ja height atribuudid täpsustavad pildi laiuse ja kõrguse
  • alt atribuudiga lisatakse pildile alternatiivtekst
  • style atribuuti kasutatakse elemendi stiliseerimiseks
  • lang atribuudiga deklareeritakse dokumendis kasutatud keel
  • title atribuudiga saab kasutajale näidata elemendi kohta lisainfot

Litsents

Icon for the Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License

Veebidisain by Koostaja: Mikk Oad; Tekst: Andrus Rinde, Mikk Oad is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License, except where otherwise noted.

Jaga seda raamatut