In ultimul exercitiu am folosit in interiorul tag-ului <img /> un concept nou:

<img src="..." />

Acesta se numeste un atribut si ne ajuta sa oferim unui element HTML puteri suplimentare.

Un atribut nu este altceva decat o proprietate speciale care poate schimba rolul unui element sau care doar ofera informatii suplimenare despre el.

Un element poate avea mai multe atribute. Ele se trec doar in tag-ul de deschidere, inainte de semnul de inchidere > al acestuia.

Atributul unui tag HTML

De exemplu, pentru tagul de imagine <img /> putem avea un atribut care sa precizeze sursa imaginii pe care vrem sa o afisam:

<img src="o-imagine.png" />

In acest caz src="o-imagine.png" este atributul tag-ului.

Un atribut are urmatoarea structura:

  1. numele atributului src (prescurtare de la source)
  2. semnul egal =
  3. si apoi valoarea lui cuprinsa intre ghilimele "o-imagine.png" (un URL catre locul unde se afla imaginea)

In acest caz, atributul are un rol functional, pentru ca influenteaza modul in care se comporta elementul.

Atributele unui element care se inchide

Daca am vrea sa aplicam un atribut unui element care se inchide, precum unui paragraf, acesta ar arata astfel:

<p lang="ro">
    aici avem un paragraf
</p>

Asadar, atributele pentru elementele care se inchid se trec in primul tag al lui.

In acest caz atributul este lang si este de tipul informativ pentru ca nu influenteaza cu nimic continutul paragrafului, ci doar ne ofera informatii suplimentare despre acesta.

Atribute multiple

Un tag poate avea mai multe atribute care ii ofera un comportament special:

<p id="un-id" class="o-clasa">
    aici avem un paragraf
</p>

Elementul de mai sus contine doua atribute noi, pe care le vom folosi foarte des: id si class.

Acestea doua vor fi foarte folositoare cand vom discuta despre CSS si JavaScript.

Tipuri de atribute

Dupa cum am spus exista atribute functionale, care influenteaza comportamentul elementului HTML si atribute informative, care doar ofera detalii despre acel element.

Exista cateva atribute care se pot intalni la orice element (precum class si id) dar exista si atribute care sunt specifice doar unui element.

De exemplu pentru elementul <img />, avem atributul src.

Acesta este folosit de foarte putine elemente si in nici un caz de un paragraf. Asadar putem spune ca acest atribut este oarecum spcific elementului <img />.

Pe parcursul acestui curs vom descoperi atribute noi si vom discuta si despre rolul lor.