A HTML, azaz a HyperText Markup Language az internet alapnyelve. Minden weboldal, amelyet meglátogatsz, legalább részben HTML-re épül. Lehetővé teszi a fejlesztők számára a webes tartalom strukturálását, linkek beágyazását, szöveg formázását, képek beillesztését és interaktív űrlapok létrehozását.
Ez a nyelv nem csak a webes tartalom strukturálását szolgálja, hanem a weboldalak hozzáférhetőségében és használhatóságában is döntő szerepet játszik.
A HTML jelentősége túlmutat a statikus weboldalak létrehozásán. Zökkenőmentesen együttműködik a CSS-sel (Cascading Style Sheets) és a JavaScript-tel, így alkotva azt a hármast, amelyre a legtöbb modern webes alkalmazás támaszkodik. Ez a kölcsönhatás dinamikus, reszponzív és vizuálisan vonzó weboldalakat tesz lehetővé, amelyek különböző platformokon és eszközökön keresztül is elérhetők.
Íme a 30 leggyakrabban használt HTML parancs (elemek és attribútumok):
Alapvető HTML-elemek
1. `<html>` – A HTML dokumentum gyökéreleme.
2. `<head>` – A dokumentum fejlécét tartalmazza (metaadatok).
3. `<title>` – Az oldal címe (böngészőfülön jelenik meg).
4. `<body>` – A dokumentum törzse, amely az oldal tartalmát tartalmazza.
5. `<h1>` – `<h6>` – Címsorok (h1 a legnagyobb, h6 a legkisebb).
6. `<p>` – Bekezdés (paragrafus).
7. `<br>` – Sortörés.
8. `<hr>` – Vízszintes vonal.
Szövegformázás
9. `<b>` – Félkövér szöveg.
10. `<i>` – Dőlt szöveg.
11. `<u>` – Aláhúzott szöveg.
12. `<strong>` – Kiemelt (fontos) félkövér szöveg.
13. `<em>` – Kiemelt (fontos) dőlt szöveg.
14. `<mark>` – Kiemelt (háttérszínnel kiemelt) szöveg.
15. `<small>` – Kisebb méretű szöveg.
16. `<sub>` – Alsó index.
17. `<sup>` – Felső index.
Hivatkozások és képek
18. `<a href=”URL”>` – Hivatkozás (link) egy másik oldalra.
19. `<img src=”URL” alt=”leírás”>` – Kép beszúrása.
Listák
20. `<ul>` – Rendezett lista (pontokkal).
21. `<ol>` – Számozott lista.
22. `<li>` – Listaelemek megadása.
Táblázatok
23. `<table>` – Táblázat létrehozása.
24. `<tr>` – Táblázatsor.
25. `<td>` – Táblázat cella.
26. `<th>` – Fejléc cella (félkövér és középre igazított).
Űrlapok és bevitel
27. `<form>` – Űrlap létrehozása.
28. `<input>` – Felhasználói bevitel (szövegmező, jelszó, gomb stb.).
29. `<button>` – Gomb létrehozása.
30. `<label>` – Űrlapmező címkéje.
Ezek az elemek adják a HTML alapját, és a legtöbb weboldalon megtalálhatóak.
Vannak olyan HTML elemek, amelyeket nem kell lezárni (ún. önálló, önzáró vagy void elemek). Ezek nem tartalmaznak belső tartalmat, ezért nincs szükségük záró </tag> címkére.
Önzáró HTML elemek:
<br>– Sortörés.<hr>– Vízszintes vonal.<img>– Kép beillesztése.<input>– Beviteli mező (pl. szövegmező, gomb, jelszó, stb.).<meta>– Metaadatok a dokumentumhoz (pl. karakterkódolás, SEO).<link>– Külső erőforrások csatolása (pl. CSS fájlok).<source>– Forrásmegadás<audio>és<video>elemekhez.<area>– Képterületek megjelölése egy<map>elemen belül.<col>– Táblázatos oszlopstílusok meghatározása<colgroup>elemen belül.<wbr>– Szóelválasztási javaslat a böngészőnek (ha a szöveg tördelése szükséges).
Fontos megjegyzések:
- XHTML-ben vagy szigorúbb HTML szabványoknál ajánlott önzáró formában írni őket:
<br /> <img src="image.jpg" alt="Leírás" /> - HTML5-ben azonban az önzáró forma nem kötelező, így az alábbi írásmód is helyes:
<br> <img src="image.jpg" alt="Leírás">
