HTML Tananyag

 

Jegyzettömbben szerkesztjük, indítása START Menü  keresőbe elkezdjük

 


gépelni jegyzettömb

 

 Klikk-rá.

 

 

Az üres jegyzettömbünket rögtön elmenthetjük, a Fájl menü, mentés másként paranccsal.

 

Miután kiválasztottuk mentés helyének a mappánkat, a fájl típust át kell állítani minden fájl-ra, a fájlnevet egyben írva, ékezet nélküli nevet választva és a név után a .html kiterjesztést írva mentsük el.

 

A webes dokumentum tartalmát egy címkével kezdjük és egy címkével zárjuk. A tartalmi részt két részre osztjuk:
• fejrész (angolul: head)
• törzs (angolul: body)
A dokumentum fejrészét a <html> címkéken belül <head> és a lezáró </head> címkék közzé tesszük. A dokumentum törzsét a <html> címkéken belül a <head></head> címkék után következnek, amit a <body> kezdő és a </body> lezáró címkék közzé tesszük. Ezek után egy HTML dokumentum váza így néz ki:

 

<html>
<head>

</head>
<body>

</body>
</html>

 

A weboldalunkat kiegészíthetjük a fejrészben a lap címével is, ez a címsorban jelenik meg. Ezt a <title></title> címkék között adhatjuk meg.

 

<html>
<head>
<title>Oldal címe</title>
</head>
<body>

</body>
</html>

 

A <body></body> címke közé megy a a weboldal tartalma, ami megjelenítésre kerül.

 

A weboldal fejezetei, címei

Weboldalunk fejezetcímeit a h1; h2; h3; h4; h5; vagy h6 címkék közé helyezhetjük el, ahol az eltérést csak a h után álló szám adja. A h1-es a legnagyobb és a h6-os a leg kisebb. Ezeket a törzsrészen belül használhatjuk.

Pl.:

<h1>I. Fejezet</h1>
<h2>II. Fejezet</h2>
<h3>III. Fejezet</h3>
<h4>Iv. Fejezet</h4>
<h5>V. Fejezet</h5>
<h6>VI. Fejezet</h6>

 

Új sor, és Új bekezdés kezdése

 

Fontos a tagoltság és az átláthatóság, a weboldalunkon a szövegen belül az új sorhoz nem elég egy entert tenni, ennek külön kódja van, így ha sortörést szeretnénk, használjuk a <br> parancsot. A <br> a soron belül bárhol működik.

Elsős sor                                Elsős sor <br> Második sor <br> Harmadik sor
<br>
Második sor
<br>

Harmadik sor

 

Új bekezdést a <p></p> parancsok között tehetünk. Az új bekezdéseken belüli formázásokat később nézzük meg.

Pl.:

<p> Első bekezdés</p>

<p> Második bekezdés</p>

<p> Harmadik bekezdés</p>

 

Színek a weboldalon

 


Weboldalunkon színkódokat adhatunk meg, RGB kódolással lásd elmélet. Némely szín esetében használható a szín angol neve, de ezeket nem feltétlen kezeli minden böngésző.

 

A teljes weboldal színét a <body>-n belül adhatjuk meg a bgcolor paranccsal és az = jel után ”” jelek közé írjuk a szín nevét vagy RGB kódját.

Pl.: <body bgcolor=”silver”> ennek hatására a weboldalunk szürke lesz.

 

A weboldalunkon lévő összes szöveg színét szintén a <body> –n belül adhatjuk meg, a text paranccsal.

Pl.: <body text=”blue”> ennek hatására az összes szöveg kék lesz.

 

Természetesen a <body> -n belül egyszerre több tulajdonság is megadható.

<body bgcolor=”silver” text=”blue”>

 

Betű szín és betű méret

Az átláthatóság és a kisemelés miatt a legtöbb esetben szükség lehet egyes szövegrészek eltérő színnel történő kiemelésére, vagy más betűmérettel való írásra. Erre weboldalunkon a <font> címkét használjuk a fontnak van záró címkéje is és a nyitó és a záró címke közötti részt formázza.

 

A betű méret a font címke size parancsával szabható személyre.

<font size=>  az egyenlőség jel után jön a szám amely a betű méretét határozza meg.

<font size=1> Egyes betűméret</font><br>

<font size=4> Négyes betűméret</font><br>

<font size=8> Nyolcas betűméret</font>

 

 

 

 

 


A betű szín a font címke color parancsával adható meg.

Pl.: <font color=#FF0000>Piros szöveg</font>

 

Természetesen a font címke tulajdonságai itt is beírhatók egyszerre is.

Pl.: <font size = 4 color=#FF0000>Piros szöveg 4-es méretben</font>

 

Betű stílusok és hatások

Mint már a szövegszerkesztőben is megszokhattuk használható pár betűstílus illetve hatás is, ilyenek pl a félkövér betűk, az aláhúzott, a felső és alsó index és társai. Weboldalunkon ezeknek is vannak címkéi, ezeket itt láthatjátok, fontos hogy itt is vannak záró címkék és minden a nyitó és záró címke közötti tartalomra érvényes lesz a formázás.

 

Igazítás

Szintén a szövegszerkesztőhöz hasonlóan használhatjuk a négyféle igazítást, a jobbra, balra, középre, és a sorkizártat. Ezek a <p> címke align tulajdonságával adhatóak meg az angol neveikkel.

Az „align” tulajdonságnak négy értéke lehet:

left  -   balra

right  -  jobbra

center  -  középre

Justify  -  sorkizárt

Megadásának módja <p align=”left>A záró címkéig minden szöveg balra lesz igazítva</p>

<p align=”center”> Ez a szöveg középre lesz igazítva.</p>