Csoportosító elemek

Folytassuk az ismerkedést a HTML5 szabvány azon tagjeivel, amelyekkel különböző csoportosításokat végezhetünk el.

<p> – Bekezdés

Mire használjuk?

A <p> taggel már a bevezetőben megismerkedtünk. Segítségével a szöveget bekezdésekre oszthatjuk. Az adott bekezdés tartalmát a <p> és </p> elemek közé kell tenni. A záró </p> tag kirakása nem kötelező, de mi a kód átláthatóságának érdekében azt ajánljuk, hogy mindig szerepeltessük azt.

A böngészőprogramok a bekezdések előtt és után – a tagolás érdekében – nagyobb helyet hagynak, ennek mértékét is a stíluslapok segítségével adhatjuk meg a margó beállításával.

Amennyiben a bekezdésen belül sortörést akarunk elhelyezni, használhatjuk a korábban bemutatott <br> taget.

Paraméterek: globális attribútumok

Vissza a tartalomjegyzékhez

<div> – Blokk definiálása

Mire használjuk?

A <div> elemnek nincs önálló szemantikai jelentése, arra használjuk, hogy csoportba foglaljunk nagyobb blokkokat, míg a korábban bemutatott <span> tag a soron belüli elemek (pl. bekezdésen belüli szavak, szócsoportok, mondatok stb.) formázásánál lehet jó.

Paraméterek: globális attribútumok

Az alábbi interaktív példában bekezdések és <div> elemek használatára is mutatunk példát.

Vissza a tartalomjegyzékhez

<hr> – Vízszintes elválasztó

Mire használjuk?

A <hr> tag elhelyezésével egy elválasztó vonalat jeleníthetünk meg. A <hr> tagnek nincs záró párja. Általában weboldalon belüli tagoló elemként szoktuk használni, például egymástól logikailag is elkülöníthető szövegrészek között. CSS segítségével megváltoztatható, formázható a megjelenése.

Paraméterek: globális attribútumok

Vissza a tartalomjegyzékhez

<pre> – Előreformázott szöveg

Mire használjuk?

Olyan szövegnél alkalmazhatjuk, ahol fontos szerepe van a szöveg előre formázásának, vagyis az elhelyezett szóközöknek, sortöréseknek. A <pre> tag tartalmaként megadott szöveget a böngésző azonos szélességű (monospace) betűtípussal jeleníti meg.

Az alábbi esetekben érdemes lehet használni a <pre> elemet:

• Olyan szövegnél, ahol üres sorok jelzik a bekezdések végét (pl. e-mail szövege)
• Számítógépes programkód közlésénél
• ASCII-ábrák használatánál
• Verseknél, ahol a szöveg formázásnak jelentése van (pl. képversek)
• Dalszövegek esetén, ahol az akkordok a szövegrészek fölé vannak írva, és lényeges, hogy melyik szótag fölé kerüljenek

Paraméterek: globális attribútumok

            Fájdalomtól
            megtört szí
            vvel tudato
     m hogy hosszas szenvedés u
     tán tegnap délután meghalt 
     a Vers Az elhunytat alul-
            író személ
            yes halott
            jának teki
            nti s egyb
            en ezúton
            mond köszö
            netet mind
       azoknak kik virágot
     pacsirtát és ligetet helyez
  tek el szeretett halottunk sírján
              Emléke
              örökké
               élni
                fo
                g 
      

Vissza a tartalomjegyzékhez

<blockquote> – Idézet

Mire használjuk?

Amennyiben az oldalunkon egy külső forrásból származó idézetet helyezünk el, akkor azt érdemes <blockquote> tagben elhelyeznünk.

Paraméterek:

• globális attribútumok
• cite: azon oldal webcíme, ahonnan az idézet származik

<blockquote cite="http://hu.wikipedia.org/wiki/HTML5">
<p>
A HTML5 a HTML (Hypertext Markup Language, a web fő jelölőnyelve) 
korábbi verzióinak az átdolgozott változata. A kifejlesztésének egyik fő célja, 
hogy a webes alkalmazásokhoz ne legyen szükség plug-inek (pl. Adobe Flash, 
Microsoft Silverlight, Oracle JavaFX) telepítésére.
</p>
</blockquote>

Vissza a tartalomjegyzékhez