HTML leírás
Történet
1. Felső szintű elemek
2. A fejlécben alkalmazható elemek
3. Általános blokkszintű elemek
4. Listaelemek
5. Táblázatok
 

A nyelv története

 

Hypertext Markup Language

A Hypertext Markup Language (HTML) – magyarul hypertext leíró nyelv - segítségével bármely méretű ablakban, képernyőn, bármilyen számítógépen tetszetősen megjeleníthető az átvitt szöveg. Hypertext dokumentum hálózaton történő továbbításakor tulajdonképpen egy egyszerű ASCII file továbbítása történik. Ebben semmiféle vezérlőkarakter nem található (amelyeket a személyi számítógépek szövegszerkesztő programjai használnak, mivel ezek rendszerről rendszerre változnak). Helyettük ún. vezérlőjeleket (markup tags) találunk a szövegben, melyek biztosítják a szöveg helyes megjelenítését, illetve a beillesztett képek, utalások (hyperlinkek) kapcsolását.

HTML történelem

A HTML fejlesztésekor először kitűzött cél a megjelenítőktől teljesen független, a dokumentum szerkezetére koncentráló leírásmód volt. Eleinte tehát csak olyan formázó utasítások kaptak helyet a nyelvben, mint például címsor, lista, stb., amik nem az adott szövegrész kinézetét, megjelenését írták le, hanem a dokumentumban elfoglalt szerepét. A módszer előnye (nem kell törődni a kinézettel, azt minden megjelenítő saját maga alakítja ki, elég ha a dokumentum szerkezetét követjük a leírás során) egyben a legnagyobb hátránynak is bizonyult. A készítők ugyanis nem akarták, hogy kicsússzon a kezükből a dokumentumok formázásának lehetősége, így az igények egyre több fizikai formázó utasítást hoztak létre, amelyek hatása többé-kevésbé ugyanúgy nézett ki minden megjelenítőn. Persze ez (főleg eleinte) kevésbé volt így, de mára a megjelenítők harcából győztesen kikerült két program (Netscape Navigator és Microsoft Internet Explorer) nagyjából ugyanazt mutatja az adott HTML forrásból. Természetesen az oldalak készítőinek nem szabad leragadni egyetlen megjelenítőnél, az igazán jó honlap élvezhető akár karakteres megjelenítőn is.

HTML alapok

Egy HTML dokumentum tetszőleges szövegszerkesztővel elkészíthető, mindössze annyi szükséges, hogy az adott program tudjon sima szövegfájlba menteni. Jól használhatók ilyen célra a különböző programozási rendszerek beépített szerkesztői, mint például a Windows-os Notepad, a Teach Text Macintosh-on vagy a kicsit fapadosnak tűnő UNIX-os vi. Ugyanakkor a WWW egyre inkább népszerűvé válása magával hozta a rengeteg színes szélesvásznú honlap készítői környezetet, amelyekkel a felhasználó minden előismeret nélkül elkészítheti saját bemutatkozó oldalát. Ezen programok előnye a nagyon könnyű használat (egyes programok nem is engednek belejavítani az általuk generált HTML HTML kódba), hátránya hogy az így elkészült lapok általában sablonosak, nem rendelkeznek annyi interaktivitással, mint a saját magunk által megírt oldalak.

Általános tapasztalat, hogy egyrészt minden lehetőség kihasználásához elengedhetetlen a HTML és a kapcsolódó nyelvek ismerete, másrészt hogy a legújabb specifikációban foglalt lehetőségeket eleinte nagyon kevés fejlesztőprogram támogatja. Ez logikus is, hiszen a programozóknak is idő kell ahhoz, hogy elkészítsék szerkesztőjük aktuális változatát. Természetesen elvárásainknak megfelelően nagyon jól használhatók ezek a programok egy bizonyos alap elkészítéséhez, amit aztán egy hagyományos szerkesztőprogramba betöltve kicifrázhatunk, egyénivé tehetünk.

A két szerkesztőtípus között képeznek használható átmenetet egyes HTML-szerkesztő programok. Ezek első ránézésre egy közönséges karakteres szövegszerkesztőnek tűnnek, ám a használatuk közben kiderül, hogy nagyon hasznos utasításokkal támogatják a HTML dokumentumok megírását. Ilyen szolgáltatások lehetnek pl.: HTML elemek beillesztése, HTML struktúra szerinti kiemelés, szintaktikai ellenőrzés, stb. Egy ilyen szerkesztőprogram nagyban elősegíti a hatékony és gyors oldalkészítést.

 
 

Nyelvi elemek (TAG-ek)

 
1. Felső szintű elemek
 
A következőkben a HTML felső szintű (top-level) elemeivel ismerkedhetünk meg.
Ezek:

HTML

Használata:
<html>...
...
</html>

Tartalmazza a <HEAD> és azt követően a <BODY>, vagy <FRAMESET> elemeket, gyakorlatilag bekeretezi a HTML dokumentumot. Ez az elem tudatja a böngészővel, hogy weblappal, HTML dokumentummal van dolga.
Mivel ún. top-level elem, így ezt nem tartalmazhatja semmilyen más elem.

HEAD

Használata:
<head>...
...
</head>

Tartalmazhat pontosan egy <TITLE> elemet, opcionálisan a <BASE> és <ISINDEX> elemeket. Ide kerülhetnek a <SCRIPT>, <STYLE>, <META>, <LINK>, vagy <OBJECT> elemek is.

A <HTML> elem tartalmazhatja:

A <HEAD> elem fejléc-információkat tartalmaz a dokumentumról; úgymint a címét, kulcsszavakat, rövid leírást és stíluslapokat (style sheet).
Kötelező elhelyezni minden HTML dokumentumban, eztt követheti a <BODY>, vagy a <FRAMESET> elem.

BODY

Használata:
<body>...
...
</body>

Attribútumai:
 

BACKGROUND=

"URL"

A html dokumentum háttérképe

BGCOLOR=

"szín"

A dokumentum háttérszíne, vagy színkódja

TEXT=

"szín"

A szöveg színe, vagy színkódja

LINK=

"szín"

A linkek színe, vagy színkódja

VLINK=

"szín"

A látogatott linkek színe, vagy színkódja

ALINK=

"szín"

Az  aktív link színe, vagy színkódja

ONLOAD=

"script"

A dokumentum betöltõdésekor hajtódik végre

ONUNLOAD=

"script"

A dokumentum bezárásakor (a lap elhagyásakor) hajtódik végre

A <BODY> elem tartalmazza a dokumentum törzsét. A nem frame-ekből felépített lapokon használata kötelező. Frame-dokumentumoknál a <NOFRAMES> elemnek tartalamznia kell a <BODY>-t.

FRAMESET

Használata:
<frameset>...
...
</frameset>

Tartalmazhat egy, vagy szükség szerint több <FRAMESET> és <FRAME> elemet, valamint opcionálisan a <NOFRAMES> elemet.
Felső szintű elem lévén, csak a <HTML> elem tartalmazhatja.

Attribútumai:

ROWS=

"magasság"

A vízszintes osztás magassága százalékban, vagy pixelben

COLS=

"szélesség"

A függőleges osztás szélessége százalékban, vagy pixelben

ONLOAD=

"script"

Az összes frame betöltődése után hajtódik végre

ONUNLOAD=

"script"

Az utolsó frame elhagyásakor hajtódik végre

A <FRAMESET> elem a <FRAME> elemek tartalmazásával a böngészőablak négyszög alakú alablakokra osztására alkamas. ROWS és COLS attribútumaival és azok paramétereivel határozzuk meg az alablakok (keretek v. frame-ek) méreteit és tulajdonságait. A keretszélességek és -magasságok megadhatók abszolút, vagy relatív értékben (százalékosan, vagy pixelben). Érdemes a két módszert kombinálni, tehát több frame estén egyesek méretét abszolút értékben, másokét százalékosan megadni. Különösen javasolt a pixelben megadott méret alakalmazása olyan esetben, amikor a frame-nek fix méretű objektumot (képet, stb..) kell tartalmaznia.

 

2. A fejlécben alkalmazható elemek
 
A HTML dokumentum <HEAD> szekciójában a következő elemek szerepelhetnek:
Ezek:

BASE

Használata:
<BASE>

Attribútumai:
HREF="url" (A dokumentum helye - abszolút hivatkozásként)
TARGET="frame-név" (Annak a frame -nek a neve, ahova a linkek alapértelmezetten megnyílnak.)

Más elemet nem tartalmazhat.

A legtöbb weblap nem szükséges, hogy tartalmazza az elsőként írt attribútumot. Viszont érdemes felvenni akkor, ha a html dokumentumot nem eredeti helyén tekintik meg (pl.: e-mail mellékletként küldjük, stb).

A TARGET attribútumot frame-ekkel felépített lapon használjuk. Ha egy frame-ben levő link <A> eleme nem hivatkozik külön valamely más frame-re, akkor a link célja a <BASE TARGET="frameneve"> által meghatározott keretben nyílik meg. (További információk a FRAME-ekről)

ISINDEX

Használata:
<ISINDEX PROMPT="szöveg">

Felhasználói szövegbevitelre alkalmas, alapértelmezettként a PROMPT attribútumban megadott szöveget írja ki.
A W3C nem javasolja, helyette az <INPUT> elem használata javasolt.

LINK

Használata:
<LINK>

Attribútumai:

REL=

Link típusa

Kapcsolat linkhez

REV=

Link típusa

Kapcsolat linktol

HREF=

"URL"

Hiperhivatkozás

TYPE=

Tartalom típus

A link tartalmának típusa

TARGET=

célframe

A frame, ahova a link megnyitja a hivatkozott dokumentumot

MEDIA=

Médialeíró

 

HREFLANG=

Nyelvi kód

A hivatkozás nyelve

CHARSET=

Karakterkészlet

A hivatkozás karakterkódolása

A <LINK> elem definiálja a dokumentum kapcsolatait. A <HEAD> szekcióban tetszőleges számban helyezhető el. A legtöbb böngésző támogatja ezt az elemet. A REL és REV attribútumok határozzák meg a kapcsolat természetét a dokumentum és a kapcsolt erőforrás között. A REL hivatkozáskapcsolatot határoz meg az aktuális dokumentumtól a kapcsolt erőforrás felé, míg a REV ellenkező irányú kapcsolatot fejez ki.
Példával mutatva:

<LINK REL=Fuggelek HREF="labjegyzet.html">

Ez azt mutatja, hogy a labjegyzet.html az aktuális dokumentum függeléke, míg a <LINK REV=Alfejezet HREF="akarmi.html">

pedig azt, hogy az aktuális dokumentum az akarmi.html alfejezete.
A REL és REV attribútumok értékei a kapcsolattípusok szóközzel elválasztott felsorolása.

Használható a <LINK> elem külső stíluslap (style sheet) csatolásához is:

<LINK REL=StyleSheet HREF="kedvenc.css">

A <LINK> elem MEDIA attribútuma határozza meg azt a médiát, amelyhez a kapcsolt erőforrás tervezve van. A HTML 4.0 a következő médialeírókat ismeri:

Az opcionális HREFLANG és CHARSET attribútumok a kapcsolat nyelvét és karakterkódolását tartalmazzák. A nyelv megadható az RFC 1766 szerint (en - angol, en-US - amerikai angol, ja - japán, stb...). Az ékezetes betűk alkalmazására vonatkozó nemzetközi előírásokat az ISO-8859-2 írja le.

A TARGET attribútum a frame -ekkel létrehozott lapokon használatos. Részletes ismertetése a FRAME fejezetben olvasható.

META

Használata:
<META>

Attribútumai:

  • NAME, Név: (tulajdonságnév);
  • HTTP-EQUIV, Név: HTTP fejléc-információk;
  • CONTENT, hozzárendelt adat;

Más elemet nem tartalmazhat.

A NAME attribútum egy tulajdonságnevet határoz meg, amelynek értékét a CONTENT attribútum tartalmazza. A CONTENT szöveges információt tartalmazhat, de nem írható bele HTML tag (elem).
Nincs standard, elfogadott listája a META elemben használható tulajdonság-érték pároknak; a dokumentumok szerzői maguk dönthetik el, milyen metaadatokkal hízlalják dokumentumjaikat. A következő példa a lap szerzőinek definiálását mutatja meg:

<META NAME=author CONTENT="Monostory Miklós - leírások"> <META NAME=author CONTENT="WorldWideWorx - design">

Néhány kereső használja a keywords és description tulajdonságokat, jelentőséget adva ezek használatának. Jó tudni, hogy a keresők többsége a description tulajdonság esetében csak az első 200 karaktert veszi figyelembe (kb. 3 gépelt sor). Ha ugyanaz a szó túl sokszor fordul elő egy dokumentum keywords tulajdonságának értékeként, néhány kereső nem indexeli az oldalt (figyelmen kívül hagyja). A kulcsszó - (keyword) listát a keresők általában az első 1000 karakterig veszik figyelembe.
Néhány kereső támogatja a robots tulajdonság használatát is.
A következő példa azt mondja a keresőknek, hogy ne indexeljék a lapot, de kövessék a rajta található hivatkozásokat:

<META NAME=robots CONTENTS="noindex, follow">

A HTTP-EQUIV tulajdonság is használható a NAME helyett. E tulajdonság csak kevésben különbözik az előzőekben ismertetettől; tudomására hozza a böngészőknek, hogy értéke HTTP fejléc-információ. Néhány példa:

<META HTTP-EQUIV="Expires" CONTENT="22 jan 2000 17:10">

a dokumentum lejárati idejét állítja be.

<META HTTP-EQUIV="Content-Script-Type" CONTENT="text/javascript">

 

kliensoldali scriptnyelvként a javascriptet definiálja.

<META HTTP-EQUIV="Contetnt-Style-Type" CONTENT="text/css">

meghatározza, hogy a használt stílusok nyelve a CSS.

<META HTTP-EQUIV="Content-Type" CONTENT="text/html charset=iso-8859-2">

definiálja a dokumentum tartalmát (szöveg, mégpedig a HTML előírásai szerint), és a használt karakterkészletet. Ez jelen esetben a latin 2 -es, amely tartalmazza a magyar ékezetes betűket is.

<META HTTP-EQUIV="Refresh" CONTENT="10, URL=http://www.w3.org">

arra utasítja a böngészőt, hogy a lap teljes betöltődésétől számított 10 másodperc után 'ugorjon' a W3C honlapjára.

SCRIPT

Használata:
<SCRIPT></SCRIPT>

Attribútumai:

  • TYPE=ContetntType - A használt scriptnyelv típusa;
  • LANGUAGE=CDATA - A használt scriptnyelv neve;
  • SRC="url" - Külső script elérési útja;
  • CHARSET=Charset - A külső script karakterkódolása;

A SCRIPT elem a dokumentum kliens-oldali scriptjeit tartalmazza. Ez a scripttípus a lapnak meglehetős interaktivitást engedélyez, az olvasó általi beavatkozás lehetővé tételével.

A SCRIPT elem TYPE attribútuma határozza meg a scriptnyelv médiatípusát (pl.: text/javascript). A legtöbb böngésző azonban csak a W3C által nem preferált LANGUAGE attribútumot támogatja, amely a használt script nyelvét írja le. A támogatott nyelvek közé tartozik a JavaScript, a JavaScript1.1 és a VBScript.

A beágyazott script is a SCRIPT elemen belül írható le. Az SRC attribútum lehetővé teszi, hogy ne kelljen a html kódba írni a scriptet, hanem külső fájlban legyen tárolható. A CHARSET attribútum írja le a külső script karakterkódolását (általában iso-8859-1). Ha a böngésző nem tudja végrehajtani a külső scriptet, akkor a dokumentumba beágyazott scriptet futtatja le. A külső script megfelelő futása esetén a beágyazottat figyelmen kívül hagyja.

<SCRIPT TYPE="text/javascript" SRC="script.js" CHARSET="iso-8859-1">
<!--
//Beágyazott script, amely akkor hajtódik végre, ha a külső script (script.js) nem elérhető//
-->

</SCRIPT>

A HEAD-ben és a BODY-ban is tetszőleges számú SCRIPT elem helyezhető el.

STYLE

Használata:

<STYLE>...</STYLE>

Attribútumai:

Beágyazott stíluslapinformációt tartalmaz, csak a HEAD elemben használható.

A STYLE elem stíluslapot ágyaz be a dokumentumba. A HEAD elem bármennyi STYLE elemet tartalmazhat. A kötelező TYPE attribútum határozza meg a használt stílusnyelvet. Az internetes stílusnyelvek között a legelterjedtebb a CSS, ennek meghatározása a text/css.

A TITLE attribútum használata opcionális; nevet ad a stíluslapnak.

A MEDIA attribútum azt a médiát határozza meg, amelyre a stíluslap alkalmazva lesz; lehetővé teszi stíluslap alkalmazását a különböző eszközökre.

 

A következő példa a stíluslap beágyazásának egy lehetőségét mutatja:

<STYLE TYPE="text/css" MEDIA=screen>
<!--
BODY {background: url(hatter.gif) red; color: black}
P EM {background: yellow; color: black}
.note {margin-left: 5em; margin-right: 5em}
-->

</STYLE>

A HTML 3.2 megjelenése előtti böngészők nem ismerik a css-t, így hibásan jelenítik meg az így formázott lapokat. (Tulajdonképpen kiírják a képernyőre a stíluslap utasításait...) Ezért megfelelő gondosságnak tekinthető, ha a css leírást a standard SGML 'comment' (megjegyzés) jelei közé illesztjük:
<!--comment-->

Beágyazott stíluslapot akkor érdemes használni, ha az adott lapnak egyedi stílust szán szerzője. Ha több dokumentumnak szánunk ugyanolyan stílust, kézenfekvőbb külső stíluslapot alkalmazni.

TITLE

Használata:

<TITLE>...</TITLE>

Egyszerű szöveget tartalmazhat.

A TITLE elem tartalmazza a dokumentum címét. Minden dokumentum HEAD szekciója pontosan egy TITLE elemet tartalmazhat.

A TITLE elemben írt szöveg (text/plain) jelenik meg a böngészőablak címsorában. Ezért a jó cím rövid, utal a dokumentum tartalmára, könnyen megjegyezhető. Nem elhanyagolható tényező, hogy a keresők többsége a megadott keresési feltételek szerint a dokumentumok TITLE elemében is keres. A <TITLE></TITLE> elemek közé írt szöveg általában javasolt hossza max. 60 karakter.

 

3. Általános blokkszintű elemek
 
Ez a fejezet azokat az elemeket tartalmazza, amelyek használata a lap egy-egy szövegrészének (blokkjának) formázására alkalmas. Ezek az elemek maguk tartalmaznak előre definiált formázási elemeket, nem a lap szerzőjének kell az egyes szövegformázásokat elvégeznie. A HTML nyújtotta lehetőségeket a következő elemekkel aknázhatjuk ki:

ADDRESS

Használata:

<ADDRESS>...</ADDRESS>

Tartalmazhatja a soron belül alkalmazható elemeket,
Tartalmazhatják az APPLET, BLOCKQUOTE, BODY, BUTTON, CENTER, DD, DEL, DIV, FIELDSET, FORM, IFRAME, INS, LI, MAP, NOFRAMES, NOSCRIPT, OBJECT, TD és TH elemek.

Az ADDRESS elem kapcsolatfelvételi -tartási információkat nyújt a lapon keresztül. Ezek az információk tartalmazhatják a lap készítőjének, fenntartójának nevét, linkeket a fenntartó más lapjaihoz, e-mail, illetve postai címét, telefonszámát, és így tovább...(lásd a cím alatt)
Az alábbi példa az ADDRESS elem egy alkalmazási módját mutatja be:

<ADDRESS>
Készíti: <A href=mailto:mmonostory@uze.net>Monostory Miklós</A> és
<A href=mailto:worldwideworx@freemail.hu>WorldWideWorx</A>
</ADDRESS>

BLOCKQUOTE

Használata:

<BLOCKQUOTE>...</BLOCKQOUTE>

Attribútumaként használható a CITE elem.
Tartalmazhat egy, vagy több
blokk-szintű elemet, vagy SCRIPT tag -et.

Tartalmazhatják az APPLET, BLOCKQUOTE, BODY, BUTTON, CENTER, DD, DEL, DIV, FIELDSET, FORM, IFRAME, INS, LI, MAP, NOFRAMES, NOSCRIPT, OBJECT, TD, TH elemek.

A BLOCKQUOTE elem egy idézet-blokkot definiál. Nem úgy, mint a soron belüli idézetek, az idézetblokkok tartalmazhatnak blokk-szintű elemeket; úgymint P, vagy TABLE, de a BLOCKQUOTE nem helyezkedhet el bekezdésen (<P>), vagy valamely soron belül alkalmazható elemen belül.
Az opcionális CITE attribútum az idézet forrására mutathat.

<BLOCKQUOTE CITE="http://www.valahol.com/konyvtar/ezkerulide.html">
<P>Itt szerepelhet egyéb szöveg is</P>
</BLOCKQUOTE>

CENTER

Hsználata:

<CENTER>...</CENTER>

 

Soron belül használható elemeket és blokk-szintű elemeket tartalmazhat.

Tartalmazhatják az APPLET, BLOCKQUOTE, BODY, BUTTON, CENTER, DD, DEL, DIV, FIELDSET, FORM, IFRAME, INS, LI, MAP, NOFRAMES, NOSCRIPT, OBJECT, TD, TH elemek.

A CENTER elem egy olyan szövegrészt, vagy más elemet határoz meg, amelynek tartalma a böngészőablakban vízszintesen középen jelenik meg. A CENTER tag a <DIV ALIGN="center"> formula rövidített alkalmazási lehetősége, bár a böngészők a CENTER-t valamivel jobban támogatják.

A CENTER használatos még a táblázatok középre igazításához is, mert jónéhány böngészőből hiányzik a <TABLE ALIGN="center"> kifejezés támogatása. Ezt szemlélteti az alábbi példa:

<CENTER>
<TABLE>
<TR ALIGN="center">
<TH SCOPE=col>Név</TH>
<TH SCOPE=col>Kor</TH>
<TH SCOPE=col>Város</TH>
</TR>
<TR ALIGN="center">
<TD>Béla</TD>
<TD>25</TD>
<TD>Szeged</TD>
</TR>
</TABLE>
</CENTER>

Megjegyzendő, hogy a CENTER magát a táblázatot igazítja középre, a cellák tartalmát nem. A fenti példában a TR tag ALIGN attribútumát használtuk erre a célra.

DEL

Használata:

<DEL>...</DEL>

 

Attribútumai:

  • CITE=URL - a szöveg törlésének oka, illetve egyéb információk
  • DATETIME=Dátum - A szöveg törlésének ideje

Tartalmazhat más soron belül használható elemeket, és ugyanilyen elemek tartalmazhatják.

A DEL elem tartalma olyan szöveg, amely a dokumentum újabb verziójának készítése során törölve lett. Ez az elem a szöveg változásainak jelzésére használatos.
A DEL használható akár blokkszintű, akár soron belül alkalmazható (inline) elemként is. Soron belüli elemként alkalmazva nem tartalmazhat blokkszintű elemet.

Az opcionális CITE attribútum arról ad információt, miért lett az adott szöveg törölve.

Opcionális a DATETIME attribútum használata is, amely a törlés dátumát és idejét tartalmazza kis- és nagybetűérzékenyen; ÉÉÉÉ-HH-NN   óó-pp-mm formátumban.
Mivel a DEL tag a böngészők között viszonylag gyengén támogatott, mód nyílik helyette a STRIKE elem használatára is, de ez utóbbit a W3C nem javasolja.

DIV

Használata:

<DIV>...</DIV>

 

Attribútumai:

  • ALIGN=[left;center;right;justify] (Vízszintes igazítás)

Soron belüli, illetve blokkszintű elemeket tartalmazhat.
Tartalmazhatják az APPLET, BLOCKQUOTE, BODY, BUTTON, CENTER, DD, DEL, DIV, FIELDSET, FORM, IFRAME, INS, LI, MAP, NOFRAMES, NOSCRIPT, OBJECT, TD, TH elemek.

A DIV elemet általános blokszintű "tartalmazó"-ként (container) határozhatjuk meg, amely lehetővé teszi a lap szerzőjének, hogy a <DIV></DIV> elemek közé zárt tartalom egészére írjon elő stílust, igazítási, vagy egyéb formázási műveleteket. A DIV elem bármely más elemet tartalmazhat, ideértve másik, beágyazott DIV elemet is.

A DIV elem sikerrel kombinálható a CLASS, ID, vagy LANG attribútumokkal. Példának okáért egy tartalomjegyzéket helyezhetünk a DIV elembe, kiegészítve a CLASS=tartalom tulajdonság-érték párral, amely így lehetővé teszi a szerzőnek, hogy a CSS -ben egyszer meghatározott stílust rendeljen hozzá a site valamenyi tartalomjegyzékéhez.

A nem javasolt ALIGN attribútum segítségével állítható be a vízszintes igazítás; balra, jobbra, középre, illetve sorkizártan.
A <DIV ALIGN="center"> formulánál azonban a böngészők sikeresebben kezelik a <CENTER> elemmel történő középre igazítást.

H1-6

Használata:

<Hn>...</Hn>

 

ahol az n 1 - 6 közé eső egész szám.

Attribútumai:

  • ALIGN=[left;center;right;justify] (Vízszintes igazítás)

Soron belüli, illetve blokkszintű elemeket tartalmazhat.
Tartalmazhatják az APPLET, BLOCKQUOTE, BODY, BUTTON, CENTER, DD, DEL, DIV, FIELDSET, FORM, IFRAME, INS, LI, MAP, NOFRAMES, NOSCRIPT, OBJECT, TD, TH elemek.

A H1, H2-6 elemek első - hatodik szintű címsorokat határoznak meg. Egy dokumentum általában egy H1 elemet tartalmaz, a legfontosabb rész kiemelésére.

A nem javasolt ALIGN attribútum segítségével állítható be a vízszintes igazítás; balra, jobbra, középre, illetve sorkizártan.

A böngészők a Hn elemeket általánosan nagyméretű, félkövér betűkkel jelenítik meg.

HR

Használata:

<HR>

 

Attribútumai:

  • ALIGN=[left;center;right] (Vízszintes igazítás)
  • NOSHADE - Vékony vonal
  • SIZE=nn - Vonalvastagság pixelekben
  • WIDTH - A vonal hossza

Más elemet nem tartalmazhat;
Tartalmazhatják az APPLET, BLOCKQUOTE, BODY, BUTTON, CENTER, DD, DEL, DIV, FIELDSET, FORM, IFRAME, INS, LI, MAP, NOFRAMES, NOSCRIPT, OBJECT, TD, TH elemek.

A HR elem használhatával vízszintes vonal jeleníthető meg. Jól használható a lapon egyes témakörök elhatárolására. A W3C által nem javasolt ALIGN attribútum segítségével a beszúrt vonal balra, középre, jobbra igazítható.
A NOSHADE és SIZE attribútumok segítségével a vonal stílusa szabható testre. A NOSHADE használatával a vonal árnyékmentes (vékonyabb) lesz, a SIZE használatával a vonalvastagság pixelekben meghatározható.

INS

Használata:

<INS>...</INS>

 

Attribútumai:

  • CITE=URL - A szöveg forrása;
  • DATETIME - A beszúrás dátuma és ideje

Tartalmazhat soron belül használható és blokkszintű elemeket; ugyanilyen státuszú elemek tartalmazhatják.

Az INS elem beszúrt szöveget tartalmaz. Jól használható egy dokumentum szövegváltozásainak jelzésére. A böngészők az így megjelölt tartalmat aláhúzottan jelenítik meg.

A hivatalos W3C ajánláson kívül használható még a TITLE attribútum is, amely 'tooltip'-et, szövegbuborékot jelenít meg az INS elem tartalma mellett-felett.

<INS TITLE="Inserted text">Beillesztett szöveg</INS>

Az opcionálisan használható DATETIME attrinútum közli a beszúrás dátumát és idejét, kis- és nagybetűérzékeny formában.

ISINDEX

Használata:

<ISINDEX>

 

Attribútum:

  • PROMPT="szöveg" - Tájékoztató szöveg

Más elemet nem tartalmazhat.

Tartalmazhatják az APPLET, BLOCKQUOTE, BODY, CENTER, DD, DEL, DIV, FIELDSET, FORM, HEAD, IFRAME, INS, LI, MAP, NOFRAMES, NOSCRIPT, OBJECT, TD, TH elemek.

Az ISINDEX elem egysoros szövegbeviteli mező használatának lehetőségét kínálja fel. Az elem PROMPT attribútuma által meghtározott szöveg fog megjelenni a beviteli mező mellett, a felhasználónak szóló tájékoztatásként, valahogy így:


Írja be a nevét:


Az ISINDEX a HTML 4 -ben nem javasolt elem. A W3C helyette az INPUT elem használatát helyezi előtérbe.

Az ISINDEX egyenértékű a FORM elemen elhelyezett INPUT elem használatával; ahol a bevitt adat típusa text, és a METHOD attribútum értéke get.

NOSCRIPT

Használata:

<NOSCRIPT>...</NOSCRIPT>

Soron belüli, illetve blokkszintű elemeket tartalmazhat.
Tartalmazhatják az APPLET, BLOCKQUOTE, BODY, BUTTON, CENTER, DD, DEL, DIV, FIELDSET, FORM, IFRAME, INS, LI, MAP, NOFRAMES, NOSCRIPT, OBJECT, TD, TH elemek.

A NOSCRIPT elem használatával a kliens-oldali scriptek helyett alternatív tartalom jeleníthető meg. Ha a böngésző nem támogatja az adott scriptnyelv használatát, vagy a felhasználó letiltja a kliensoldali scriptek futtatását, a script futása helyett hibaüzenet jelenik meg. A NOSCRIPT elemet a SCRIPT elem után kell elhelyezni.

A kliensoldali scriptek általában meglehetős dinamikát és interaktivitást biztosítanak a lapnak, amit statikus tartalommal nemigen lehet helyettesíteni. Ezért a NOSCRIPT elem tartalma szükségszerűen 'szürkébb' lesz a script-tartalomnál.

P

Használata:

<P>...</P>

Attribútumai:

  • ALIGN=[left; center; right; justify] - Vízszintes igazítás

Soron belüli elemeket tartalmazhat.
Tartalmazhatják az ADDRESS, APPLET, BLOCKQUOTE, BODY, BUTTON, CENTER, DD, DEL, DIV, FIELDSET, FORM, IFRAME, INS, LI, MAP, NOFRAMES, NOSCRIPT, OBJECT, TD, TH elemek.

A P elem egy bekezdést határoz meg. A záró tag (/P) opcionális, de használata megelőzhet jónéhány ismert böngészőhibát, főleg CSS használata esetén. Megjegyzendő, hogy nem tartalmazhat más blokkszintű (pl: TABLE, FORM) elemet.

A W3C által nem javasolt ALIGN attribútum segítségével állítható be a bekezdés vízszintes igazítása balra, középre, jobbra, vagy sorkizártan.

A HTML szabvány/ajánlás nem írja elő a P elem megjelenítésének mikéntjét. A böngészők általában az egyes P elemek által meghatározott bekezdéseket egységes egészként kezelik; az első sor behúzása nélkül balra igazítva jelenítik meg. Az egyes bekezdések között a böngészők általában egy sort üresen hagynak.

PRE

Használata:

<PRE>...</PRE>

Attribútumai:

  • WIDTH=Szám

Tartalmazhat soron belüli elemeket, kivéve: IMG, OBJECT, APPLET, BIG, SMALL, SUB, SUP, FONT, BASEFONT.
Tartalmazhatják az APPLET, BLOCKQUOTE, BODY, BUTTON, CENTER, DD, DEL, DIV, FIELDSET, FORM, IFRAME, INS, LI, MAP, NOFRAMES, NOSCRIPT, OBJECT, TD, TH elemek.

A PRE elem előformázott szöveget tartalmaz. A böngészők az előre meghatározott fontkészlettel ábrázolják, nem vonják össze a szóközöket, és nem törik az ablak széléhez a sorokat.

A PRE tag hasznos lehet kódok, költemények megjelenítéséhez, ahol a behúzások, esetleges többes szóközök fontosak az áttekinthetőség szempontjából.

A nem javasolt WIDTH attribútum utasítja a böngészőt az előformázott szöveg kívánt sorhosszúságának beállítására. A gyakorlatban azonban a böngészők ezt az attribútumot legtöbbször figyelmen kívül hagyják.

 

4. Listaelemek
 
Ebben a részben több nagyon hasznos elemet tárgyalunk, amelyekkel átláthatóbbá tehetőek felsorolásaink. Ezeket az elemeket már a nagyon régi szövegszerkesztők is ismerték, természetesen a HTML-ből sem maradhattak ki annak szabványosításakor.

DIR

Használata:

<DIR>...</DIR>

Attribútumai:

  • COMPACT ("Kompakt kijelzés")

Tartalmaz egy, vagy több LI elemet, amely viszont nem tartalmazhat blokkszintű elemeket.
Tartalmazhatják az APPLET, BLOCKQUOTE, BODY, BUTTON, CENTER, DD, DEL, DIV, FIELDSET, FORM, IFRAME, INS, LI, MAP, NOFRAMES, NOSCRIPT, OBJECT, TD és TH elemek.

A DIR elem egy könyvtár listát definiál, tartalmaz egy vagy több LI elemet, amelyek megadják a felsorolás elemeit. A LI az egymásba ágyazás megakadályozása érdekében nem tartalmazhat blokkszintű elemeket.

A COMPACT attribútum használatával javasolhatjuk a böngészőnek, hogy szükség esetén nyomja össze a listát, pontosabban a listaelemek közötti üres helyeket. Ezt az attribútumot csak kismértékben támogatják a böngészők.

Maga a DIR elem sem javasolt a HTML 4.0-ban, helyette az UL taget helyezi előtérbe, mely amúgy is sokkal szélesebb körben elfogadott.

DL

Használata:

<DL>...</DL>

Attribútumai:

  • COMPACT ("Kompakt kijelzés")

Tartalmaz egy, vagy több DT vagy DD elemet.
Tartalmazhatják az APPLET, BLOCKQUOTE, BODY, BUTTON, CENTER, DD, DEL, DIV, FIELDSET, FORM, IFRAME, INS, LI, MAP, NOFRAMES, NOSCRIPT, OBJECT, TD és TH elemek.

A DL elem egy definíciólistát definiál. Egy listabejegyzés egy DT és egy DD elemmmel hozható létre. Előbbi a feltétel definíció létrehozásához szükséges, míg utóbbi hordozza a feltétel tényleges definícóját.

Egy definíciólista hordozhat többszörös feltételt egy adott definícióra, amennyire csak megengedik ezt az adott körülmények. Szintén lehetséges feltétel megadása megfelelő definíció nélkül, és fordítva, de ez néha labilissá teheti a szerkezetet.

<DL>

  <DT class="example">Blokkszintű elemek</DT>
  <DD>
    <P>
      A HTML-ben a blokkszintű elemek rendszerint tartalmaznak
      soron belüli és más blokkszintű elemeket. Ezeket általában
      máshogy kell formázni, mint a "sima" soron belüli elemeket,
      tipikusan igaz ez az új sorra a vizuális böngészőknél.
    </P>
  </DD>

  <DT>Soron belüli elemek</DT>
  <DT>Szöveg szintű elemek</DT>
  <DD>
    <P>
      Az egy soron belüli (vagy szöveg szintű) elemek rendszerint
      csak szöveges adatokat vagy más hasonló jellegű adatot
      tartalmaznak.
    </P>
  </DD>

</DL>

A DT és DD tag záró része elvileg elhagyható, de nem javasoljuk, nhány böngészőnél problémát okozhat, főleg, ha stíluslapokat is felhasznált a készítő

Figyeljük meg a CLASS attribútum használatát, amely a fenti példánál is látható. Ez lehetővé teszi a készítő számára, hogy Stíluslapokon keresztül könnyedén befolyásolja a böngésző működését. Például több definíciólista azonos külalkját egyszerre lehet így meghatározni. A Stíluslapok (CSS) használatáról nem sokára bővebben is szót ejtünk.

A COMPACT attribútum elvileg itt is használható, de nem ajánlott a W3C állásfoglalása szerint.

LI

Használata:

<LI>...</LI>

Attribútumai:

  • TYPE (disc,square,circle|1,a,A,i,I)
  • VALUE (megadható egy kezdőszám, ha rendezett a felsorolás)

Tartalmazhat szövegszintű, és blokkszintű elemeket.
Tartalmazhatják az OL,UL,MENU és DIR elemek.

A LI elem egy listabejegyzést definiál, méghozzá kizárólag az OL, UL, MENU, vagy DIR elemek részeként.

A LI tartalmazhat blokkszintű elemeket, úgy mint H2,TABLE,UL illetve OL, kivéve, ha a nem javasolt MENU, vagy DIR részeként hasznosítottuk.

Ez lehetővé teszi további OL, vagy UL elemek beágyazását, ahogy azt a következő példa is mutatja:

<UL>
  <LI>
    <H2>Kiemelt szövegrész, pl. cím</H2>
    <UL>
      <LI><A HREF="html.dtd">HTML 2.0</A></LI>
      <LI><A HREF="HTML32.dtd">HTML 3.2</A></LI>
      <LI><A HREF="strict.dtd">HTML 4.0 Strict</A></LI>
    </UL>
  </LI>
  <LI>
    <H2>Kiemelt szövegrész 2.</H2>
    <UL>
      <LI><A HREF="HTMLlat1.ent">Latin-1 Entities</A></LI>
      <LI><A HREF="HTMLsymbol.ent">Symbols and Greek Letters</A></LI>
      <LI><A HREF="HTMLspecial.ent">Other Special Characters</A></LI>
    </UL>
  </LI>
</UL>

Az egyébként nem javasolt TYPE attribútum a listaelemek jelzéseinek külalakját befolyásolja. Ezek a következők lehetnek:

  • A LI jelölései UL használatakor:
    • disc (Teli kör)
    • square (Teli négyzet)
    • circle (Üres kör)
  • A LI jelölései OL használatakor (felsorolás jellgű):
    • 1 (Arab, tízes számrendszer beli számok)
    • a (Latin kisbetűk)
    • A (Latin nagybetűk)
    • i (Római kisbetűk)
    • I (Római nagybetűk)

A stíluslapok sokkal szélesebb körű befolyásolási lehetőséget biztosítanak, például lehetséges a listaelemek képekkel történő jelölése is.

A VALUE attribútum számozáskor látja el feladatát, ha értéket adunk neki, ezzel fog kezdődni a lista számozása.

MENU

Használata:

<MENU>...</MENU>

Attribútumai:

  • COMPACT ("Kompakt kijelzés")

Tartalmazhat egy, vagy több LI elemet, amelyek viszont ebben az esetben nem tartalmazhatnak semmilyen blokkszintű elemet.
Tartalmazhatják az APPLET, BLOCKQUOTE, BODY, BUTTON, CENTER, DD, DEL, DIV, FIELDSET, FORM, IFRAME, INS, LI, MAP, NOFRAMES, NOSCRIPT, OBJECT, TD és TH elemek.

A MENU tag egy menülistát definiál, LI menübekezdések alkalmazásával. Ezek a fentiek szerint nem tartalmazhatnak tehát semmilyen blokkszintű taget, azért, hogy a MENU-t ne lehessen beágyazni.

A MENU elemet nem ajánlja a W3C, helyette az UL taget preferálja.

A COMPACT attribútum segítségével utasítható a böngésző a lista összehúzására, amelyet a betűk közötti üres rész szűkítésével érhet el csak. Ezt az attribútumot nagyon kevés böngésző támogatja.

OL

Használata:

<OL>...</OL>

Attribútumai:

  • TYPE=[ 1 | a | A | i | I ] - számozási stílus
  • START - A számlálás kezdőértéke
  • COMPACT - kompakt megjelenítés

Ez a tag tartalmazhat egy, vagy több LI elemet és helyet foglalhat a következő elemekbe ágyazva: APPLET, BLOCKQUOTE, BODY, BUTTON, CENTER, DD, DEL, DIV, FIELDSET, FORM, IFRAME, INS, LI, MAP, NOFRAMES, NOSCRIPT, OBJECT, TD és TH.

Az OL tag egy ún. rendezett listát definiál, elentétben az UL elemmel, a lista elemeinek meghatározott rendje van; a böngésző sorszámozza ezeket automatikusan.

A számozás stílusa a TYPE attribútum segítségével állítható be, a következőképpen:

  • 1 (Arab számokkal, tízes számrendszerben: 1, 2, 3, 4, 5, ...)
  • a (Latin kisbetűkkel: a, b, c, d, e, ...)
  • A (Latin nagybetűkkel: A, B, C, D, E, ...)
  • i (Római, kisméretű "számokkal": i, ii, iii, iv, v, ...)
  • I (Római, nagyméretű "számokkal": I, II, III, IV, V, ...)

További beállítási lehetőségek vannak, de ezekhez elengedhetetlen a stíluslapok használata.

Elvileg a START attribútum segítségével állítható be a számlálás kezdőértéke, de ez a W3C dokumentációja szerint nem javasolt.

A COMPACT attribútum sem javasolt, egyébként ezzel lehet rávenni a böngészőt, hogy a listaelemk közötti üres helyeket összehúzza.

UL

Használata:

<UL>...</UL>

Attribútumai:

  • TYPE=[ disc | square | circle ] - a listaelem előtt szereplő jelzés
  • COMPACT - kompakt megjelenítés

Ez a tag is tartalmazhat egy, vagy több LI elemet és helyet foglalhat a következő elemekbe ágyazva: APPLET, BLOCKQUOTE, BODY, BUTTON, CENTER, DD, DEL, DIV, FIELDSET, FORM, IFRAME, INS, LI, MAP, NOFRAMES, NOSCRIPT, OBJECT, TD és TH.

Az UL tag egy rendezetlen listát definiál, de az OL elemmel ellentétben itt a listaelemek nincsenek rangsorolva, a listán belüli hierarchia rendezetlen.

A TYPE attribútum segítségével kiválaszthatunk egy jelzést, amely a listaelemek elé kerül, minden sorba. Ezek lehetnek: disc (teli kör), square (teli négyzet) és circle (üres kör). Stíluslapok használatával bővebb eszköztár tárul fel előttünk.

A COMPACT attribútum nem javasolt, de ezzel lehet a listaelemek közötti üres helyeket összehúzatni a böngészővel.

 

5. Táblázatok
 
Táblázatokat sok helyen és esetben használunk. Akár adatok áttekinthető elrendezésére, akár darabolt (sliced) képek összeállítására, a lehetőségeknek csak az alkotó fantázia szab határt.
Ez a fejezet a táblázatoknál használható HTML elemek áttekintéséhez kíván segítséget nyújtani.

TABLE

Használata:
<TABLE>...</TABLE>

Attribútumai:

  • SUMMARY = Szöveg - A táblázat rövid leírása, ismertetése
  • WIDTH = Hossz - A táblázat szélessége
  • BORDER = Pixel - A szegély vastagsága pixelekben
  • FRAME = [ void; above; below; hsides; lhs; rhs; vsides; box; border ] - A külső szegély tulajdonságai
  • RULES = [ none; groups; rows; cols; all ] - A belső szegély tulajdonságai
  • CELLSPACING = Hossz - A cellák közti köz mérete
  • CELLPADDING = Hossz - A cella széle és tartalma közti köz mérete
  • ALIGN = [ left; center; right ] - A táblázat igazítása
  • BGCOLOR = Szín

Tartalmazhatja opcionálisan a CAPTION elemet, amit 0, vagy több COL és COLGROUP, majd az opcionális THEAD, TFOOT, TBODY elemek követnek.

Tartalmazhatják az APPLET, BLOCKQUOTE, BODY, BUTTON, CENTER, DD, DEL, DIV, FIELDSET, FORM, IFRAME, INS, LI, MAP, NOFRAMES, NOSCRIPT, OBJECT, TD, TH elemek.

A TABLE elem használatával egy táblázat definiálható, amelybe adatok rendezhetők el, két dimenzióban. Táblázat használatos oldalelrendezéshez is, de az oldalak szerzői általában elkerülik ezt a lehetőséget. A táblázatok használata gondokat is okozhat keskeny abalkok, nagyméretű betűtípusok, vagy szöveges böngészők esetén. A legjobban elterjedt böngészők semmit sem jelenítenek meg, amíg a táblázat teljes egészében le nem töltődött, ami figyelembe veendő körülmény, ha az egész oldalt táblázatos elrendezéssel tervezzük meg.

A W3C HTML ajánlása szerint a táblázatnak tartalmaznia kell legalább egy TBODY elemet, de a TBODY elem kezdő- és lezáró tagje elhagyható, ha csak egy TBODY elemet tartalmaz a táblázat és nincs THEAD és TFOOT elem.
Fentiek szerint egy egyszerű táblázat kódja a következőképp néz ki:

<TABLE>
<TR>
<TH>Rövidítés</TH>
<TH>Teljes kifejezés</TH>
</TR>
<TR>
<TD>A F A I K</TD>
<TD>As Far As I Know - Ahogy én tudom</TD>
</TR>
<TR>
<TD>I M H O</TD>
<TD>In My Humble Opinion - Szerény véleményem szerint</TD>
</TR>
</TABLE>

A TABLE elemnek van egy opcionálisan használható SUMMARY attribútuma is; amely segítségével leírható a táblázat létrehozásának célja, illetve a táblázat struktúrája. Ez az áttekintő lehetőség igen hasznos lehet a karakteres böngészőt használók számára. Egyszerű táblázat esetén a CAPTION attribútum megfelelő használata szinte helyettesítheti a SUMMARY -t, de bonyolultabb táblázatok esetén szükséges lehet egy részletesebb áttekintés is. A SUMMARY attribútum tartalma a táblázat előtt külön bekezdésként jelenik meg.

<TABLE SUMMARY="Ide írhatjuk be a táblázat tartalmának rövid ismertetését">

 

A TABLE elem használatához rendelkezésre áll néhány formázó attribútum:

  • A WIDTH attribútum segítségével határozható meg a táblázat szélessége akár abszolút értékben - pixelben, vagy százalékosan, a rendelkezésre álló képernyőterület arányában. A fix szélesség meghatározása általában kerülendő, főleg az 500 pixel fölötti értékek, tudniilik alacsony képernyőfelbontás esetén vízszintes gördítősáv nem kívánt megjelenését okozhatja.
  • A BORDER attribútum segítségével határozható meg a táblázat külső keretének vastagsága, pixelekben.
  • A FRAME attribútum (a böngészők szegényesen támogatják) határozza meg, hogy a táblázat külső szegélyének melyik oldala látszik. Lehetséges értékei:
    • void - nincs szegély;
    • above - csak a felső szegély látszik;
    • below - csak az alsó szegély látszik;
    • hsides - csak a bal oldali szegélyek látszanak;
    • vsides - csak az alsó és felső szegélyek látszanak;
    • lhs, rhs - a bal, illetve jobb oldali szegélyek (left, right) látszanak;
    • box, border - minden szegély látszik.
    Alapértelmezett értéke a void, kivéve, ha a BORDER attribútum értéke pozitív, ebben az esetben az alapértelmezett érték a FRAME=border. A <TABLE BORDER> kifejezés érvényes, böngészők által jól támogatott rövidítése a <TABLE FRAME=border> kifejezésnek.
  • A RULES attribútum - bár szegényesen támogatott a böngészők által - meghatározza a cellák közti szegélyeket. Lehetséges értékei:
    • none - nincsenek látható belső szegélyek;
    • groups - csak a meghatározott cellacsoportok szegélyei látszanak;
    • rows - csak a sorok közti szegélyek látszanak;
    • cols - csak az oszlopok közti szegélyek látszanak;
    • none - az alapértelmezett érték, ha a BORDER attribútum értéke 0, vagy ha nincs megadva.
    • all - a BORDER attribútum minden, az előzőekhez képest más értéke esetén ez az alapértelmezett érték. Minden szegély látszik.
  • A CELLSPACING attribútum határozza meg a cellák közti szabad hely méretét, a a CELLPADDING pedig a cella szegélye és tartalma közti szabad hely méretét (tkp. a belső "margót"). A CELLPADDING értéke megadható abszolút értékben (pixelben), vagy százalékosan. A százalékos érték viszonyítási alapja a cellában felhasználható képpontok száma. Megjegyzendő, hogy a böngészők ebben az esetben nemigen támogatják a százalékos méretmegadást, gyakran a 20% -ot 20 -nak értelmezik. Mindkét tag beállítása a cella egészére vonatkozik.
  • A nem javasolt ALIGN attribútummal állítható be a táblázat vízszintes igazítása. Lehetséges értékei a left, center, right, azaz balra, középre és jobbra. A böngészők a balra, illetve jobbra igazított táblázatoka általában, 'lebegő' objektumként kezelik, tehát a szöveget körbefuttatják a táblázat körül. Ezt megelőzendő, lehetséges a <BR CLEAR=all> kifejezés használata. Ha a böngésző nem támogatja a <TABLE ALIGN="center"> formát, a táblázatot lehetséges a <CENTER>..</CENTER> elemek közé is beilleszteni.
  • A nem javasolt BGCOLOR attribútum használatával állítható be a táblázat háttérszíne. Használatával érdemes óvatosan bánni, mert böngészőtől függően felülbírálja a táblázat egyes celláira megadott színbeállításokat.

CAPTION

Használata:
<CAPTION>...</CAPTION>

Attribútumai:

  • ALIGN=[top; bottom; left; right] - A táblázatcím igazítása

Tartalmazhat soron belüli elemeket,
csak a TABLE elem tartalmazhatja.

A CAPTION elem határozza meg a táblázat címét. Haználata esetén a TABLE elemen belül más nem előzheti meg.

A jó cím egy rövid fejléccel látjael a táblázatot. Egyszerű táblázatoknál a cím rövid összefoglalásra is alkalmas, mintegy kiegészíti a táblázat tartalmát. Bonyolultabb táblázatoknál kiegészíthető a TABLE elem SUMMARY attribútumával is, ahol akár több mondatban összefoglalható a táblázat tartalma.

<TABLE SUMMARY="Ide írható a hosszabb leírás">
<CAPTION>Ide kerül a táblázatcím</CAPTION>
<TR>
<TD>
</TD>
</TR>
</TABLE>

A nem javasolt ALIGN attribútum segítségével állítható be a táblázat címének igazítása. Lehetséges értékeinek használatával a cím felülre, alulra, balra, vagy jobbra igazítható.

COLGROUP

Használata:
<COLGROUP>...</COLGROUP>

Attribútumai:

  • SPAN=Szám - Oszlopok száma a csoportban;
  • WIDTH=Szám - Az oszlopok együttes szélessége;
  • ALIGN=[left; center; right; justify; char] - A cellák vízszinted igazítása a csoportban;
  • CHAR=Karakter -
  • CHAROFF=Hossz -
  • VALIGN=[top; middle; bottom; baseline] - A cellák függőleges igazítása a csoportban.

Tartalmazhat 0, vagy több COL elemet.

Tartalmazhatja a TABLE elem.

A COLGROUP elem egy oszlopcsoportot definiál a táblázaton belül. Használata esetén a CAPTION elem után és a THEAD elem előtt kell szerepelnie.

A SPAN attribútum határozza meg az oszlopok számát a csoportban; alapértelmezett értéke 1. Szerepelhet a COLGROUP -ban még COL elem is, amely az egyes oszlopok celláinak tulajdoságait írhatja le, felülbírálva az oszlopcsoportra megadott tulajdonságokat. A SPAN nem használható, ha szerepel a COLGROUP -on belül akár egy COL elem is.

A WIDTH attribútum határozza meg az egyes oszlopok szélességét a csoportban. Értéke kifejezheti az oszlop abszolút szélességét pixelben: egész számként, vagy a táblázat egészéhez viszonyított szélességet: százalékosan.

Az ALIGN attribútum határozza meg az egyes cellák igazítását az oszlopcsoportban. Lehetséges értékeinek beállításával az igazítás történhet balra, középre, jobbra, sorkizártan. Az ALIGN=char kifejezés segítségével a cellatartalom a CHAR attribútumban megadott karakter szélességéhez igazítható. Alapértelmezett értéke a decmális pont.

A CHAROFF attribútum határozza meg az igazító karakter első előfordulásának offszetét (eltolás). Értéke pixelben megadott szám, vagy a cellaszélesség százaléka. A CHAROFF="50%" az igazító karaktert a cella közepére tolja.

A VALIGN attribútum határozza meg a cellatartalom függőleges igazítását. Lehetséges értékeinek beállításával az igazítás történhet a cella tetejéhez, középre, a cella alsó szegélyéhez, illetve az alapvonalhoz. Ez utóbbi esetben minden cella első sora azonos magasságba kerül.

COL

Használata:
<COL>

Attribútumai:

  • SPAN="Szám" - Oszlopok száma
  • WIDTH="Szám" - Az oszlopok teljes szélessége
  • ALIGN=[left; center; right; justify; char] - A cellák vízszintes igazítása
  • CHAR=Karakter - Igazító karakter
  • CHAROFF=Szám - Igazító karakter offszete (eltolás)
  • VALIGN=[top; middle; bottom; baseline] - A cellák függőleges igazítása

Más elemet nem tartalmazhat,
Tartalmazhatják a
COLGROUP és TABLE elemek.

A COL elem attribútumaival egy táblázat oszlopának tulajdonságait határozza meg. Használata esetén a TABLE elemen belül az opcionális CAPTION elem után, és a szintén opcionálisan használható THEAD előtt kell elhelyezni. A COLGROUPpal ellentétben a COL elem nem csoportosítja az oszlopokat, csupán egy-egy oszlop valamennyi cellájára érvényes tulajdonságokat definiál.

SPAN attribútuma határozza meg azon oszlopok számát, amelyek megosztoznak a COL elem attribútumaiban meghatározott tulajdonságokon; alapértelmezett értéke 1. A COL elhelyezhető közvetlenül a TABLE elemben, vagy tartalmazhatja a COLGROUP elem is. Ha a COLGROUPban van elhelyezve, attribútumai felülbírálják a COLGROUPban leírt tulajdonság-érték párokat.

WIDTH attribútuma határozza meg a COL elemmel egybefogott oszlopok szélességét. Értéke kifejezheti az oszlop abszolút szélességét pixelben: egész számként, vagy a táblázat egészéhez viszonyított szélességet: százalékosan.

ALIGN attribútuma segítségével állítható be az egybefogott oszlopok vízszintes igazítása. Lehetséges értékeinek beállításával az igazítás történhet balra, középre, jobbra, sorkizártan. Az ALIGN=char kifejezés segítségével a cellatartalom a CHAR attribútumban megadott karakter szélességéhez igazítható. Alapértelmezett értéke a decmális pont.

A CHAROFF attribútum határozza meg az igazító karakter első előfordulásának offszetét (eltolás). Értéke pixelben megadott szám, vagy a cellaszélesség százaléka. A CHAROFF="50%" az igazító karaktert a cella közepére tolja.

A VALIGN attribútum határozza meg a cellatartalom függőleges igazítását. Lehetséges értékeinek beállításával az igazítás történhet a cella tetejéhez, középre, a cella alsó szegélyéhez, illetve az alapvonalhoz. Ez utóbbi esetben minden cella első sora azonos magasságba kerül.

THEAD

Használata:
<THEAD>...</THEAD>

Attribútumai:

  • ALIGN=[left; center; justify; right] - Cellák vízszintes igazítása a csoportban
  • CHAR="Karakter" - A cellák igazító karaktere
  • CHAROFF="Hossz" - Az igazító karakter offszete (eltolás)
  • VALIGN=[top; middle; bottom; baseline] - Cellák függőleges igazítása a csoportban

Tartalmazhat egy, vagy több TR elemet;
Tartalmazhatja a TABLE elem.

A THEAD elem fejlécsorok csoportját határozza meg a táblázatban. A TABLE elem egy THEAD -et tartalmazhat, amelynek a CAPTION, COL, vagy COLGROUP elemek után kell következnie, és meg kell előznie az opcionális TFOOT és a kötelező TBODY elemet.

A THEAD használatával az oldalak szerzői fejlécet adhatnak táblázataikhoz, amely nyomtatáskor - több oldalas táblázatoknál - minden oldalon megjelenik. Viszonylag kevés böngésző támogatja.

Az ALIGN attribútum segítségével állítható be a celatartalom vízszintes igazítása. Lehetséges értékeinek beállításával az igazítás történhet balra, középre, jobbra, sorkizártan. A böngészők által gyengén támogatott ALIGN=char kifejezés segítségével a cellatartalom a CHAR attribútumban megadott karakter szélességéhez igazítható. Alapértelmezett értéke a decmális pont.

A CHAROFF attribútum határozza meg az igazító karakter első előfordulásának offszetét (eltolás). Értéke pixelben megadott szám, vagy a cellaszélesség százaléka. A CHAROFF="50%" az igazító karaktert a cella közepére tolja.

A VALIGN attribútum határozza meg a cellatartalom függőleges igazítását. Lehetséges értékeinek beállításával az igazítás történhet a cella tetejéhez, középre, a cella alsó szegélyéhez, illetve az alapvonalhoz. Ez utóbbi esetben minden cella első sora azonos magasságba kerül.

TFOOT

Használata:
<TFOOT>...</TFOOT>

Attribútumai:

  • ALIGN=[left; center; justify; right] - Cellák vízszintes igazítása a csoportban
  • CHAR="Karakter" - A cellák igazító karaktere
  • CHAROFF="Hossz" - Az igazító karakter offszete (eltolás)
  • VALIGN=[top; middle; bottom; baseline] - Cellák függőleges igazítása a csoportban

Tartalmazhat egy, vagy több TR elemet;
Tartalmazhatja a TABLE elem.

A TFOOT elem láblécsorok csoportját definiálja. Egy tábázat egy TFOOT elemet tartalmazhat, amelynek az opcionálisan használható THEAD elem után, de a kötelező TBODY elem előtt kell elhelyezkednie.

A TFOOT használatával az oldalak szerzői láblécet adhatnak táblázataikhoz, amely nyomtatáskor - több oldalas táblázatoknál - minden oldalon megjelenik. Mivel viszonylag kevés böngésző támogatja, az elhelyezési előírás (TBODY elé!) használhatatlanná teszi a TFOOT -ot nem támogató böngészőknél.

Az ALIGN attribútum segítségével állítható be a celatartalom vízszintes igazítása. Lehetséges értékeinek beállításával az igazítás történhet balra, középre, jobbra, sorkizártan. A böngészők által gyengén támogatott ALIGN=char kifejezés segítségével a cellatartalom a CHAR attribútumban megadott karakter szélességéhez igazítható. Alapértelmezett értéke a decmális pont.

A CHAROFF attribútum határozza meg az igazító karakter első előfordulásának offszetét (eltolás). Értéke pixelben megadott szám, vagy a cellaszélesség százaléka. A CHAROFF="50%" az igazító karaktert a cella közepére tolja.

A VALIGN attribútum határozza meg a cellatartalom függőleges igazítását. Lehetséges értékeinek beállításával az igazítás történhet a cella tetejéhez, középre, a cella alsó szegélyéhez, illetve az alapvonalhoz. Ez utóbbi esetben minden cella első sora azonos magasságba kerül.

TBODY

Használata:
<TBODY>...</TBODY>

Attribútumai:

  • ALIGN=[left; center; right; justify; char] - Cellák vízszintes igazítása
  • CHAR="Karakter" - Cellák igazító karaktere
  • CHAROFF="Hossz" - Az igazító karakter offszete (eltolás)
  • VALIGN=[top; middle; bottom; baseline] - Cellák függőleges igazítása

A TBODY elem adatsorok csoportját definiálja a táblázatban. A TABLE elemnek tartalmaznia kell egy, vagy több TBODY elemet, amelyeknek az opcionális TFOOT után kell következniük. A TBODY elem záró tag -je mindig opcionális. Kezdő tag -je csak akkor, ha a táblázat csak egy TBODY -t tartalmaz és és nem tartalmaz THEAD -et, vagy TFOOT-ot.

A THEAD, TFOOT, és TBODY elemek pontos használatával olyan táblázat hozható létre, amelynek fej- és lábléce statikus és (nagyobb táblázat esetén) tartalmi része görgethető.

Az ALIGN attribútum segítségével állítható be a celatartalom vízszintes igazítása. Lehetséges értékeinek beállításával az igazítás történhet balra, középre, jobbra, sorkizártan. A böngészők által gyengén támogatott ALIGN=char kifejezés segítségével a cellatartalom a CHAR attribútumban megadott karakter szélességéhez igazítható. Alapértelmezett értéke a decmális pont.

A CHAROFF attribútum határozza meg az igazító karakter első előfordulásának offszetét (eltolás). Értéke pixelben megadott szám, vagy a cellaszélesség százaléka. A CHAROFF="50%" az igazító karaktert a cella közepére tolja.

A VALIGN attribútum határozza meg a cellatartalom függőleges igazítását. Lehetséges értékeinek beállításával az igazítás történhet a cella tetejéhez, középre, a cella alsó szegélyéhez, illetve az alapvonalhoz. Ez utóbbi esetben minden cella első sora azonos magasságba kerül.

TR

Használata:
<TR>...</TR>

Attribútumai:

  • ALIGN=[left; center; right; justify; char] - Cellák vízszintes igazítása
  • CHAR="Karakter" - Cellák igazító karaktere
  • CHAROFF="Hossz" - Igazító karakter offszete (eltolás)
  • VALIGN=[top; middle; bottom; baseline] Cellák függőleges igazítása
  • BGCOLOR="Szín" - A sor háttérszíne

Tartalmazhat egy, vagy több TH, TD elemet.
Tartalmazhatják a THEAD, TFOOT, TBODY elemek.

A TR elem a táblázat egy sorát határozza meg. A TR elemnek egy -a THEAD, TFOOT, TBODY elemek által meghatározott- sorcsoportban kell szerepelnie, kivéve, ha a táblázat csak egy TBODY -t tartalmaz és nincs benne THEAD, vagy TFOOT, elem.

Az ALIGN attribútum segítségével állítható be a celatartalom vízszintes igazítása. Lehetséges értékeinek beállításával az igazítás történhet balra, középre, jobbra, sorkizártan. A böngészők által gyengén támogatott ALIGN=char kifejezés segítségével a cellatartalom a CHAR attribútumban megadott karakter szélességéhez igazítható. Alapértelmezett értéke a decmális pont.

A CHAROFF attribútum határozza meg az igazító karakter első előfordulásának offszetét (eltolás). Értéke pixelben megadott szám, vagy a cellaszélesség százaléka. A CHAROFF="50%" az igazító karaktert a cella közepére tolja.

A VALIGN attribútum határozza meg a cellatartalom függőleges igazítását. Lehetséges értékeinek beállításával az igazítás történhet a cella tetejéhez, középre, a cella alsó szegélyéhez, illetve az alapvonalhoz. Ez utóbbi esetben minden cella első sora azonos magasságba kerül.

A nem javasolt BGCOLOR attribútum használatával állítható be a sor háttérszíne.

TD

Használata:
<TD>...</TD>

Attribútumai:

  • ROWSPAN="Szám" - Egy oszlopban összevont cellák száma
  • COLSPAN="Szám" - Egy sorban összevont cellák száma
  • HEADERS="IDREFS" - Az aktuális cella fejléc-celláinak listája
  • ABBR="Szöveg" - Fejléc-cella tartalmának rövidítése
  • SCOPE=[row; col; rowgroup; colgroup] - A fejléc-cellához tartozó egyéb cellák
  • AXIS="CDATA" - A fejléc-cella kategóriája
  • ALIGN=[left; center; right; justify; char] - Vízszintes igazítás
  • CHAR="Karakter" - Igazító karakter
  • CHAROFF="Hossz" - Igazító karakter offszete (eltolás
  • VALIGN=[top; middle; bottom; baseline] - Függőleges igazítás
  • WIDTH="Pixel" - Cellaszélesség
  • HEIGHT="Pixel" - Cellamagasság
  • NOWRAP - Sortörés tiltása
  • BGCOLOR="Szín" - Cella háttérszíne

Tartalmazhat soron belüli elemeket és blokkszintű elemeket;
A TR elem tartalmazhatja.

A TD elem a táblázat egy celláját definiálja.

A ROWSPAN és COLSPAN attribútumok segítségével határozható meg az összevonandó cellák száma; az alapértelmezett érték 1. Kitüntetett értékként használható a 0, amivel a táblázat aktuális cellájától a táblázat végéig valamennyi sorra, vagy oszlopra vonatkozólag állítható be az összevonás. Néhány böngésző azonban a 0-t figyelmen kívül hagyja, így érdemesebb pontos értéket megadni az összevonandó cellák számára.

A HEADERS attribútum határozza meg a TH -n belül azokat a cellákat, amelyek fejlécként szerepelnek. Értéke a fejléc-cellák ID attribútum-értéke, szóközzel elválasztva. A HEADERS attribútum lehetővé teszi a karakteres böngészők számára az adott cella fejléc-információinak megjelenítését.

Az ABBR attribútum alkalmazása a fejléc-információ egy rövidített változatának megjelenítését teszi lehetővé. Ezzel megoldható, hogy a böngészők ezt a rövid formát használják, ha kevés a hely; valamint a karakteres böngészők rövid fejléc-információt jelenítsenek meg az egész cella megjelenítése előtt.

A SCOPE attribútum határozza meg azokat a cellákat, amelyek számára a TH elem fejécet definiál. A SCOPE egyszerűbb alternatívája a HEADERS attribútumnak, abban az esetben, ha a fejléc-cellák elrendezése nem túl összetett. Lehetséges értékei a következők:

  • row, ha a TH a sor hátralevő celláira vonatozik;
  • col, ha a TH az oszlop hátralevő celláira vonatkozik;
  • rowgroup, ha a TH a sorcsoport hátralévő celláira vonatkozik (pl: a hátralévő cellák THEAD, TFOOT, vagy TBODY csoportosításban vannak);
  • colgroup, ha a TH az oszlopcsoport hátralévő celláira vonatkozik (pl: a hátralévő cellák COLGROUP csoportosításban vannak).

Az AXIS attribútum a cellák kategorizálásának lehetőségét biztosítja. Értéke a kategórianevek vesszővel elválasztott listája lehet. Alkalmazását a W3C HTML 4.0 ajánlása írja le részletesen.

Az ALIGN attribútum segítségével állítható be a celatartalom vízszintes igazítása. Lehetséges értékeinek beállításával az igazítás történhet balra, középre, jobbra, sorkizártan. A böngészők által gyengén támogatott ALIGN=char kifejezés segítségével a cellatartalom a CHAR attribútumban megadott karakter szélességéhez igazítható. Alapértelmezett értéke a decmális pont.

A CHAROFF attribútum határozza meg az igazító karakter első előfordulásának offszetét (eltolás). Értéke pixelben megadott szám, vagy a cellaszélesség százaléka. A CHAROFF="50%" az igazító karaktert a cella közepére tolja.

A VALIGN attribútum határozza meg a cellatartalom függőleges igazítását. Lehetséges értékeinek beállításával az igazítás történhet a cella tetejéhez, középre, a cella alsó szegélyéhez, illetve az alapvonalhoz. Ez utóbbi esetben minden cella első sora azonos magasságba kerül.

A BGCOLOR attribútum beállított értéke határozza meg a cella háttérszínét.

TH

Használata:
<TH>...</TH>

Attribútumai:

  • ROWSPAN="Szám" - Összevont sorok száma
  • COLSPAN="Szám" - Összevont oszlopok száma
  • HEADERS="IDREFS" - Az aktuális cella fejlécei
  • ABBR="Szöveg" - Rövidítés a fejléchez
  • SCOPE=[row; col; rowgroup; colgroup] - A fejléc által lefedett cellák
  • AXIS=CDATA - A fejléc-cella kategóriája
  • ALIGN=[left; center; right; justify] - Vízszintes igazítás
  • CHAR="Karakter" - Igazító karakter
  • CHAROFF="Hossz" - Az igazító karakter offszete (eltolása)
  • VALIGN=[top; middle; bottom; baseline] - Függőleges igazítás
  • WIDTH="Pixel" - Cellaszélesség
  • HEIGHT="Pixel" - Cellamagasság
  • NOWRAP - Sortörés letiltása
  • BGCOLOR="Szín" - A cella háttérszíne

Tartalmazhat soron belüli elemeket és blokkszintű elemeket;
Csak a
TR elem tartalmazhatja.

A TH elem egy táblázat fejléc-celláját határozza meg. Ha a cella a fejléc információkon kívül adatot is tartalmaz, a TD elemet kell alkalmazni.

A ROWSPAN és COLSPAN attribútumok segítségével határozható meg az összevonandó cellák száma; az alapértelmezett érték 1. Kitüntetett értékként használható a 0, amivel a táblázat aktuális cellájától a táblázat végéig valamennyi sorra, vagy oszlopra vonatkozólag állítható be az összevonás. Néhány böngésző azonban a 0-t figyelmen kívül hagyja, így érdemesebb pontos értéket megadni az összevonandó cellák számára.

A HEADERS attribútum határozza meg a TH -n belül azokat a cellákat, amelyek fejlécként szerepelnek. Értéke a fejléc-cellák ID attribútum-értéke, szóközzel elválasztva. A HEADERS attribútum lehetővé teszi a karakteres böngészők számára az adott cella fejléc-információinak megjelenítését.

Az ABBR attribútum alkalmazása a fejléc-információ egy rövidített változatának megjelenítését teszi lehetővé. Ezzel megoldható, hogy a böngészők ezt a rövid formát használják, ha kevés a hely; valamint a karakteres böngészők rövid fejléc-információt jelenítsenek meg az egész cella megjelenítése előtt.

A SCOPE attribútum határozza meg azokat a cellákat, amelyek számára a TH elem fejécet definiál. A SCOPE egyszerűbb alternatívája a HEADERS attribútumnak, abban az esetben, ha a fejléc-cellák elrendezése nem túl összetett. Lehetséges értékei a következők:

  • row, ha a TH a sor hátralevő celláira vonatozik;
  • col, ha a TH az oszlop hátralevő celláira vonatkozik;
  • rowgroup, ha a TH a sorcsoport hátralévő celláira vonatkozik (pl: a hátralévő cellák THEAD, TFOOT, vagy TBODY csoportosításban vannak);
  • colgroup, ha a TH az oszlopcsoport hátralévő celláira vonatkozik (pl: a hátralévő cellák COLGROUP csoportosításban vannak).

Az AXIS attribútum a cellák kategorizálásának lehetőségét biztosítja. Értéke a kategórianevek vesszővel elválasztott listája lehet. Alkalmazását a W3C HTML 4.0 ajánlása írja le részletesen.

Az ALIGN attribútum segítségével állítható be a celatartalom vízszintes igazítása. Lehetséges értékeinek beállításával az igazítás történhet balra, középre, jobbra, sorkizártan. A böngészők által gyengén támogatott ALIGN=char kifejezés segítségével a cellatartalom a CHAR attribútumban megadott karakter szélességéhez igazítható. Alapértelmezett értéke a decimális pont.

A CHAROFF attribútum határozza meg az igazító karakter első előfordulásának offszetét (eltolás). Értéke pixelben megadott szám, vagy a cellaszélesség százaléka. A CHAROFF="50%" az igazító karaktert a cella közepére tolja.

A VALIGN attribútum határozza meg a cellatartalom függőleges igazítását. Lehetséges értékeinek beállításával az igazítás történhet a cella tetejéhez, középre, a cella alsó szegélyéhez, illetve az alapvonalhoz. Ez utóbbi esetben minden cella első sora azonos magasságba kerül.

A BGCOLOR attribútum beállított értéke határozza meg a cella háttérszínét.

 

  

következő 5 fejezet