HyperText Markup Language/Alapok

A Wikikönyvekből, a szabad elektronikus könyvtárból.

A HTML-nek van egy alapszerkezete, amelyre az egész kód épül, ezért ezt mindig bele kell írnunk.

Készítsük el első HTML oldalunkat: nyissuk meg a Jegyzettömböt vagy valamilyen szövegszerkesztőt és írjuk be a következő kódot:

<html>

<head>
</head>

<body>
</body>

</html>

Amint látható, 6 tagból épül fel a kód: <html>, <head>, <body> és ezek lezárásai. Ennek a három tagnek mindig benne kell lennie a kódban. Minden HTML formátumú szövegfájl a <html> utasítással kezdődik és a </html> záróutasítással végződik. Ezen elemek közé kell zárni a teljes dokumentumot. A HTML dokumentumot két részre lehet bontani: a fejlécre, ez a <head>, és a törzsre, a <body>.

Ha ezt most elmentenénk és megnyitnánk, nem jelenne meg semmi, mivel lényegi információt még nem írtunk a kódba, ezért inkább bővítsük a kódot az alábbi módon:

<html>

<head>
<title>Az oldalam címe kerül ide.</title>
</head>

<body>
Az oldalam tartalma kerül ide.
</body>

</html>

Mentsük el a kódot index.html néven, de ügyeljünk rá hogy tényleg html legyen a kiterjesztés (pl. Jegyzettömbben ki kell választani mentéskor a Fájl típusa mezőnél a "Minden fájl"-t majd ezután a .html kiterjesztéssel együtt beírni a fájl nevét). Az elmentett fájlt nyissuk meg kedvenc böngészőnkkel. Ha mindent jól csináltunk, akkor az oldalon ki van írva, hogy "Az oldalam tartalma kerül ide.", továbbá felül a címsorban az "Az oldalam címe kerül ide." felirat olvasható.

Értelmezzük a kódot: a <head> tagek közé bekerült a <title> tag. Amit ide írunk, az jelenik meg a böngésző címsorában. Fontos megjegyezni: ezt a head tagek közé kell rakni, tehát ha a body részbe raknánk, akkor nem működne.

A másik változás az, hogy beírtunk egy szöveget a <body> tagek közé, és ez megjelent magán az oldalon. Megállapíthatjuk tehát, hogy amit a <body> tagek közé írunk, azt kiírja a böngésző az oldalon. A <head> tagek közé a title-ön kívül még különböző fejlécelemek és hasonlók tartoznak, amikről később ejtünk szót.