2.1 Introducere în etichete

HTML-documentsMarkupul se bazează pe etichete . Ce este o etichetă ?

Etichetele au fost inventate în anii 70, astfel încât oamenii să poată adăuga informații de serviciu la documente pentru programele care procesează aceste documente.

Tag- acesta este un cuvânt cheie (funcțional), cel mai adesea în limba engleză, care a fost încadrat între paranteze unghiulare (mai multe și mai puține caractere) pentru ca programele să nu confunde etichetele și cuvintele obișnuite în limba engleză.

Eticheta poate conține, de asemenea, diverse informații de serviciu care pot fi utile programului care procesează documentul.

Exemplu de text cu o etichetă:

<a href="http://codegym.cc/about">
    Link to something interesting
</a>

În acest exemplu, vedem textul, eticheta „a”, precum și informații despre serviciu - atributele etichetei. Mai jos veți afla mai multe despre ele.

2.2 Tipuri de etichete: deschidere, închidere, etichetă goală

Etichetele sunt de diferite tipuri. În primul rând, sunt simple și duble. Cele mai comune sunt etichetele împerecheate . Și așa cum probabil ați ghicit deja, merg întotdeauna în perechi. Ele sunt numite și deschidere și închidere.

Eticheta de deschidere este doar un cuvânt cheie între paranteze triunghiulare. Exemplu:

<h1>

Eticheta de închidere este similară cu eticheta de deschidere, dar cuvântul cheie este precedat de o bară oblică. Exemplu:

</h1>

Eticheta de deschidere poate conține informații de serviciu - atribute, cea de închidere - nr . Eticheta de început este întotdeauna prima dintr-o pereche. Eticheta de închidere NU poate intra mai întâi în text și apoi eticheta de deschidere. Acest lucru HTML-documentnu va fi valabil.

Etichetele unice nu au o etichetă de închidere. Lista acestor etichete este definită de HTML-standard. Exemple de astfel de etichete:

  • <br>- întrerupere de linie;
  • <img>- poza.

Apropo, o etichetă pereche, dacă nu conține informații în interior, poate fi scrisă într-o formă prescurtată . Exemplu:

<h1/>

Aceasta nu este o singură etichetă, ci o etichetă pereche goală. Este ca și etichetele închise și deschise în același timp. Diferă de eticheta închisă prin faptul că bara oblică se află la capăt (înainte de a doua paranteză triunghiulară).

2.3 Arborele de etichete

Și mai multe informații importante despre etichetele asociate. Într-un document pot fi multe dintre ele și pot fi imbricate. Ce înseamnă? Aceasta înseamnă că orice text din interior HTML-documentpoate fi încadrat (împachetat) cu etichete, chiar dacă conține alte etichete. Exemplu:

<html>
    plain text
        <a href="http://codegym.cc/about">
            Link to something interesting
          </a>
     some other text
</html>

În general, în textul html poate apărea o secvență de etichete:

<h1> <h2> </h2> </h1>

Dar nu poate fi:

<h1> <h2> </h1> </h2>

Dacă eticheta de început <h2>se află într-o <h1>pereche de etichete -, atunci eticheta de final care se potrivește </h2>trebuie să fie și în interiorul unei <h1>perechi de etichete -.

Astfel, toate etichetele documentelor formează un fel de arbore de etichete . Mai întâi vine eticheta de nivel superior care cuprinde întregul document, numită de obicei <html>, are perechi de etichete copil, au propriile lor și așa mai departe.

De fapt, programul care procesează un document cu etichete îl vede exact așa - ca un arbore de etichete cu ceva text înăuntru.

2.4 Atribute

Informațiile despre etichete nu ar fi complete dacă nu am vorbi despre atribute. Etichetele unice și etichetele de început ale etichetelor asociate pot avea . Aceste atribute conțin informații utile despre conținutul etichetei.

O etichetă poate conține mai multe atribute și au următoarea formă generală:

<tag name1="value1" name2="value2">

Fiecare atribut este specificat ca o pereche de Nameși meaning. Pot exista orice număr de atribute.

«<»Dar un programator experimentat va pune imediat întrebarea: ce să faci dacă trebuie să folosești text care conține caractere sau «>»ghilimele ca valoare de atribut ?

Nume simbol Simbol intrare HTML
ghilimele duble " "
Ampersand & &
Mai puțin decât simbolul < <
Mai mult simbol > >
Spaţiu  
ghilimele unice ' '