Iată câteva dintre cele mai importante elemente HTML:
- <!DOCTYPE html>: Specifică versiunea HTML a documentului și este plasat la începutul acestuia.
- <html>: Definește începutul și sfârșitul documentului HTML.
- <head>: Conține informații despre document, cum ar fi titlul, link-uri către stiluri CSS sau scripturi JavaScript.
- <title>: Definește titlul documentului, afișat în bara de titlu a browserului.
- <body>: Conține întregul conținut al documentului, precum text, imagini, link-uri și altele.
- <h1> to <h6>: Elemente pentru a defini titluri de diferite nivele, unde
<h1>
este cel mai important și<h6>
cel mai puțin important. - <p>: Definesc un paragraf.
- <a>: Creați link-uri către alte pagini sau resurse.
- <img>: Introduce o imagine pe pagină.
- <ul>, <ol>, <li>: Creează liste neordonate (
<ul>
), ordonate (<ol>
) și elementele listei (<li>
). - <table>, <tr>, <td>: Folosite pentru a crea tabele și structura acestora.
- <form>, <input>, <button>: Elemente pentru a crea formulare și interacțiuni cu utilizatorul.
- <div>, <span>: Utilizate pentru a grupa și stiliza alte elemente, ajutând la organizarea și structurarea paginii.
- <strong>, <em>: Folosite pentru a evidenția textul, respectiv pentru a îngroșa sau îngălbeni textul.
- <br>: Adaugă un salt de linie în text.Exemplu:
<!DOCTYPE html><html lang=”en”><head><meta charset=”UTF-8″><meta name=”viewport” content=”width=device-width, initial-scale=1.0″><title>Exemplu HTML</title><style>/* Stiluri CSS pentru ilustrare */table {border-collapse: collapse;width: 50%;}table, th, td {border: 1px solid black;}</style></head><body><h1>Titlu H1 – Cel mai important titlu</h1><p>Acesta este un paragraf de text <strong>evidențiat</strong> și <em>cursiv</em>.</p><a href=”https://www.example.com” target=”_blank”>Link către Example.com</a><br><img src=”https://images.unsplash.com/photo-1457269449834-928af64c684d?q=80&w=1974&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D” alt=”Imagine de exemplu” width=”300″ height=”200″><ul><li>Element listă neordonată 1</li><li>Element listă neordonată 2</li><li>Element listă neordonată 3</li></ul><ol><li>Element listă ordonată 1</li><li>Element listă ordonată 2</li><li>Element listă ordonată 3</li></ol><table><tr><th>Coloana 1</th><th>Coloana 2</th></tr><tr><td>Rând 1, Celulă 1</td><td>Rând 1, Celulă 2</td></tr><tr><td>Rând 2, Celulă 1</td><td>Rând 2, Celulă 2</td></tr></table><br><form><label for=”username”>Nume de utilizator:</label><input type=”text” id=”username” name=”username”><br><label for=”password”>Parolă:</label><input type=”password” id=”password” name=”password”><br><button type=”submit”>Trimite</button></form><div><p>Aceasta este o <span>porțiune de text</span> în interiorul unui div.</p></div><br><p>Aceasta este o altă linie de text.</p></body>
</html>
Ce va fi afisat in browser?