Elemente HTML
Un element HTML este format dintr-un tag de deschidere, un anumit conținut și un tag de închidere. Elementul reprezintă tot ce se află de la tag-ul de deschidere până la cel de închidere. De exemplu, <h1>Primul Meu Titlu</h1> și <p>Primul meu paragraf.</p> sunt elemente.
Notă: Unele elemente nu au conținut, precum <br>. Acestea se numesc elemente goale și nu au tag de închidere.
Sintaxa unui element
Forma generală a unui element: un tag de deschidere, conținut și un tag de închidere.
<tagname>Content goes here...</tagname>
Elemente HTML Imbricate
Elementele HTML pot fi imbricate, ceea ce înseamnă că un element poate conține alte elemente. Fiecare document HTML este construit din elemente imbricate.
În exemplu, <html> este elementul rădăcină care înconjoară întregul document. În interiorul lui se află <body>, care conține conținutul vizibil. În interiorul body-ului sunt două elemente, <h1> pentru un titlu și <p> pentru un paragraf.
Exemplu
Un document cu patru elemente imbricate: html, body, h1 și p.
Rezultat: pagină HTML completă
<!DOCTYPE html>
<html lang="ro">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Elemente Imbricate</title>
</head>
<body>
<h1>Primul Meu Titlu</h1>
<p>Primul meu paragraf.</p>
</body>
</html>
Nu Omite Niciodată Tag-ul de Închidere
Unele elemente se afișează în continuare corect chiar dacă uiți tag-ul de închidere, dar nu ar trebui să te bazezi niciodată pe acest lucru. Omiterea tag-urilor de închidere poate cauza rezultate neașteptate și erori.
Exemplu
Paragrafe scrise fără tag-uri de închidere. Se pot afișa, dar aceasta este o practică proastă.
Rezultat: pagină HTML completă
<!DOCTYPE html>
<html lang="ro">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Etichetă de Închidere Lipsă</title>
</head>
<body>
<p>Acesta este un paragraf
<p>Acesta este un paragraf
</body>
</html>
Elemente HTML Goale
Elementele fără conținut se numesc elemente goale. Tag-ul <br>, care creează o întrerupere de linie, este un element gol fără tag de închidere.
Exemplu
Un paragraf cu o întrerupere de linie creată de <br>.
Rezultat: pagină HTML completă
<!DOCTYPE html>
<html lang="ro">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Br Gol</title>
</head>
<body>
<p>Acesta este un <br> paragraf cu o întrerupere de linie.</p>
</body>
</html>
HTML Nu Este Sensibil la Majuscule
Tag-urile HTML nu sunt sensibile la majuscule, deci <P> înseamnă același lucru ca <p>. Standardul nu impune litere mici, dar PromptCookbook le recomandă, iar tipurile de documente mai stricte precum XHTML le impun. PromptCookbook folosește întotdeauna nume de tag-uri cu litere mici.
Referință de Tag-uri HTML
Referința de tag-uri PromptCookbook are mai multe detalii despre fiecare tag și atributele sale. Câteva comune: <html> definește rădăcina documentului, <body> definește corpul documentului, iar <h1> până la <h6> definesc titluri.