Címszintek, bekezdések, karakterformázás,
A HTML dokumentum szövegtestének felépítése:
Minden HTML dokumentumban a <BODY> és a </BODY> utasítások fogják közre a dokumentum megjeleníteni kívánt részét (Kivéve a kereteket -> de erről majd a Keretekkel foglalkozó fejezetben írok). Tehát a törzs nyitó és záró elemei között kell elhelyezni az objektumokat, képeket, hivatkozásokat, stb..! Ha egyes utasításokat mint például szöveg színe helye linkek színe stb.. a teljes dokumentumra szeretnénk alkalmazni ezt megtehetjük a nyitóelem bevezetésekor is:<body background="hatter.jpg" bgcolor="színkód" link="színkód" vlink="színkód" alink="színkód" text="színkód">. Ebben a példában a background egyértelműen a dokumentum hátterét definiálja (ahogy a kódban írtam a háttér neve kiterjesztéssel).A bgColor a dokumentum hátterének a színét adja meg. A LINK a HTML dokumentumban található linkek színét, míg a VLINK a már bejárt linkek színét adja meg. Természetesen nem kötelező ezeket a parancsokat megadni a body utasításban.
A HTML címszintjeinek felépítése:
A HTML dokumentumban definiálhatunk címszinteket hat mélységig. Ezek a címszintek a böngészőtől függően más és más betűnagyságban fognak megjelenni. A legfelső szintű címszintet a <H1>vezetjük be és a </H1> paranccsal zárjuk le, és ezek a parancsok közé kell írni a megjelenítendő szöveget.Természetesen a többi címszintet hasonló módon definiáljuk le csak a címszintnek megfelelően változtatjuk a bevezető és záró tagban szereplő számot. Tehát ha most a negyedik címszintet szeretném használni akkor ez így nézne ki:<H4>Megjelenítendő szöveg</H4>. Lehetőségünk van ezeket a címszinteket pozicionálni is. Erre négy lehetőség van: Left, Center, justify, Right (bal, közép, sorkizárt, jobb). Előfordulhat hogy túl hosszú a cím amit amit a böngésző széttördelne. Ha ezt szeretnénk megakadályozni akkor használjuk a NOWRAP opciót.A címkék csak a szemlélők számára keltik a tagoltság érzetét, valójában pedig nem tagolják szakaszokra a dokumentumot. Ezt a tagolást a <div class="osztály" align="center">megjelenítendő szöveg</div> utasításokkal lehet meghatározni. Itt a CLASS sorolja a megfelelő SGML osztályba a szakaszt, az align pedig szintén a div pozicionálását határozza meg.
Példa a pozicionálásra:
<H1 align="left">Példa H1-re</H1>
<H6 align="center">PéldaH6-ra</H6>
<H4 align="justify">Példa H4-re</H4>
<H5 align="right">Példa H5-re</H5>
<H2 NOWRAP>Példa NOWRAP-ra</H2>
<div align="center">Példa a divre</div>
Bekezdések a HTML dokumentumban:
A HTML dokumentum is bekezdésekre tagolódik. Minden bekezdést a <p> tag vezeti be és a </p> tag zárja le. Általában a böngésző program két bekezdés között kihagy egy üres sort.
Természetesen a bekezdéseket is lehet pozicionálni a már említett négy módon: Left, Center, justify, Right (bal, közép, sorkizárt, jobb). Természetesen itt is az automatikus tördelést a NOWRAP parancs tiltja le. Amennyiben egy szövegben tördelhetetlen szóközt szeretnénk alkalmazni akkor használjuk a   utasítást. Ha egy szövegben sortörést szeretnénk alkalmazni akkor használjuk a <br> parancsot. Ennek a parancsnak nincs záró utasítása.
Példa:
<p align="left">balra igazított</p>
<p align="center">középre igazított</p>
<p align="justify">sorkizárt</p>
<p align="right">jobbra igazított</p>
<p>Ez egy alapértelmezett bekezdés</p>
<p>Így kell alkalmazni a sortörést<br>
ami hatására új sorban folytatja</p>
Kereszthivatkozások a HTML dokumentumban:
A HTML dokumentum egyik legfontosabb rendszerét képzik az egymásra illetve az egymás tartalmára mutató hivatkozások. Ezek lehetnek oldalon belülre mutató, képekre és más dokumentumokra mutató hivatkozás. A hivatkozást aktivizálva, a hivatkozással összefüggésben lévő szöveghez juttat el.
A legegyszerűbb esetben a hivatkozás az adott dokumentumban egy meghatározott részre mozdítja a böngésző ablakot. Tehát az oldalon belüli hivatkozásnak két fontos eleme van. Az egyik ilyen a könyvjelzők, amiket a dokumentumban azokra a részekre helyezünk el ahova navigálni szeretnénk a böngésző ablakot. A másik ilyen fontos elem pedig az a hivatkozás lesz, amivel az adott könyvjelzőhöz navigáljuk a böngészőt.
A könyvjelzőt a <a name="könyvjelző neve" id="célszerű ha a könyvjelző neve"> vezeti be és a </a> parancs zárja le.Célszerű ezeknek rövid neveket adni, és lehetőség szerint kerülni a szó közt, valamint a speciális karaktereket. Ha szóközre lenne szükségünk inkább használjuk az _ (alul vonás) karaktert.
A könyvjelzőre mutató hivatkozás nyitó utasítása az <a href="#könyvjelző neve"> és a záró utasítása pedig az </a>.
Másik dokumentumra mutató hivatkozásnál ugyan úgy, csak abban különbözik hogy protokolt és elérési utat kell megadni.
Képere kattintva is tudunk hivatkozni.Ebben az esetben <a href="hivatkozás"><img src="kép elérési útja"></a>. Ha ezt az alapesetet nézzük akkor a képet kerettel fogja megjeleníteni. Ezt ki tudjuk kapcsolni a Border="0" parancsot megadjuk neki. Tehát <img src="kép elérési útja" border="0">
Példák
Vegyük példának a nem létező valami.hu oldalt:
<a name="vege" id="vege"></a> <!-- a dokumentum végén helyezd el -->
<a href="#vege">A valami.hu dokumentum végére mutató hivatkozás</a>
<a href="http://iwiw.hu">Ez az iwiw-re mutató hivatkozás</a>
<a href="http://valami.hu/index.html#vege">Ez is a valami.hu oldal végére mutató hivatkozás</a>
<a href="mailto::emailcímed">Ide</a>kattintva tudsz emailt írni
Szövegformázó karakterek:
Ahogy már említettem a A HTML dokumentumról című fejezetben, hogy a HTML nyelv tartalmaz szövegformázó utasításokat. Az alábbi táblázatban ezeket foglalom össze:
Ha nem probléma akkor itt most nem írnék minden egyes karakterformázó utasításhoz példát. Mindegyik agyan az a rendszer szerint működik:
<nyitó elem>Formázandó szöveg<Záró elem>
A <Font FACE="típus" color="színkód" size="szám"></FONT> parancssorral megadható minden egyes szöveg jellemzője.A FACE paranccsal megadhatjuk a betűtípust, de ezt nem szokás használni mert nem minden rendszer támogatja az általunk megadott betűtípust.
A COLOR utasítással itt is a betű színét adhatjuk meg, míg a SIZE paranccsal a betű méretét szabályozhatjuk.Az FONT parancs ugyan úgy működik mint a többi karakterformázó utasítás.
<FONT >Általunk megjelenítendő szöveg</FONT>
Nincsenek megjegyzések:
Megjegyzés küldése