Loading...

HTML Basic – Alapok

A HTML (HyperText Markup Language) a weboldalak alapját képező jelölőnyelv. Ebben az anyagban megismerheted a HTML alapvető fogalmait, felépítését és a legfontosabb elemeket, amelyek segítségével elkezdheted saját weboldalaid létrehozását. Ezen az oldalon a HTML dokumentumok szerkezetéről, az alapvető elemekről, valamint néhány egyszerű kódrészletről lesz szó, hogy megalapozd a további részletesebb tanulnivalókat.

HTML Alapok

A HTML dokumentumok egyszerű szöveges fájlok, amelyeket .html vagy .htm kiterjesztéssel mentünk el. Minden HTML oldal elején egy deklarációval kezdünk, amely a böngésző számára jelzi, hogy HTML5-öt használunk.

Például egy nagyon alap HTML oldal így néz ki:

A legfontosabb részek

Nézzük át, melyek azok a kulcselemek, amelyek egy HTML dokumentumot felépítenek:

  • <!DOCTYPE html>: Minden HTML oldal első sora, ami jelzi, hogy HTML5-öt használunk.
  • <html>: A dokumentum gyökéreleme, mely tartalmazza az egész oldalt.
  • <head>: Az a rész, ahol háttérinformációkat adunk meg – például a karakterkódolás, az oldal címe, és hivatkozások külső stíluslapokra.
  • <title>: Az oldal címe, amely a böngésző fülén jelenik meg.
  • <body>: Itt található a tényleges tartalom: szövegek, képek, linkek, listák és egyéb elemek.

Címek, bekezdések és linkek

Az oldalon a címeket általában a <h1><h6> tagek segítségével definiáljuk, amelyek a hierarchikus felépítést segítik. A <p> tagek a bekezdéseket, míg az <a> tag a linkeket jelentik.

Például, a főcím:

És egy bekezdés:

Egy egyszerű hivatkozás:

Képek és listák

A képek beillesztése az <img> tag segítségével történik. A forrását az src attribútummal adod meg, míg az alt attribútum a kép leírását tartalmazza. A listák segítségével rendezett vagy rendezetlen módon jeleníthetünk meg adatokat.

Íme egy példa egy rendezetlen listára:

Kód részletek

<!-- Unordered list -->
<ul>
  <li>First element</li>
  <li>Second element</li>
  <li>Third element</li>
</ul>

Előnézet

  • First element
  • Second element
  • Third element

És egy rendezett lista:

Kód részletek

<!-- Ordered list -->
<ol>
  <li>Step one</li>
  <li>Step two</li>
  <li>Step three</li>
</ol>

Előnézet

  1. Step one
  2. Step two
  3. Step three

Vízszintes vonal és sortörés

A <hr> tag egy vízszintes elválasztót hoz létre, amelyet gyakran használunk a tartalom részek elválasztására. A <br> tag pedig sortörést jelent.

Önzáró elemek és kommentek

Bizonyos HTML elemek nem igényelnek külön záró taget – ezek az úgynevezett önzáró elemek, mint például az <img>, <br> vagy <hr>. Emellett kommenteket is elhelyezhetsz a kódban, de ezek a böngésző számára láthatatlanok.

Kövesd nyomon a fejlődésed 🚀

Tanulj egyszerűbben utad nyomonkövetésével teljesen ingyen.


Top eszközök

CodeHubBoardly ÚJLinksy ÚJChromo ÚJ

Nyelv kiválasztása

Téma beállítása

© 2025 ReadyTools. Minden jog fenntartva.