2. fejezet: Betűk formázása

A dolog igen egyszerű, hiszen lehet egy betű félkövér (Bold = B), aláhúzott (Underlined = U), illetve döntött (Italic = I). A megfelelő tagek ezek szerint: <B>Bold</B>,<U>Underlined</U>, illetve <I>Italic</I>. Az előbbi parancsok persze kombinálhatók is: <B><I>Félkövér és Dőlt </I></B>. Egyetlen dologra kell vigyázni csupán: A sorrendet mindig be kell tartani. Gyakorlatban ez azt jelenti, hogy mindig a legutoljára kinyitott tag zárótagját kell leírni. Nézzük a következő példát: (lásd: htmlpelda5.html)

<html>
Sima szöveg.<br>
<b>Ez félkövér.</b><br>
<i>Ez döntött</i><br>
<u>Ez aláhúzott</u><br>
<b>Ez félkövér és döntött.</i></b>
</html>

Kicsit pontosabban fogalmazva: ez olyan, mint egy csomó, egymásba csomagolt doboz. Mivel minden dobozt be akarunk zárni, ezért nyilvánvalóan a legkisebbel kell kezdenünk, majd csak utána haladhatunk fokozatosan a nagyobbak felé. Persze, egy nagyobb dobozban lehet több, kisebb doboz is, de itt is érvényes, hogy előbb a kicsiket kell lezárni és csak utána a nagyot. Röviden: be kell tartani a dobozlogikát!

3. feladat: Írjon olyan fájlt, amelyben vegyesen van döntött, aláhúzott, illetve félkövér betű, majd keverje ezeket vegyesen!

Most nézzük a betűk formázását! Az alapméret itt a 0-s, amit nem kell kiírni. Ezt mutatja a következő példa: (Lásd: htmlpelda6.html)

<html>
<font size=0>Alapméret</font>
</html>

A skála alapértelmezésben -7-től +7-ig terjedhet. Vegyük észre, hogy itt használtunk először paramétert, mégpedig a méretre. Maga a paraméter arra szolgál, hogy az alap HTML-tag funkcióját pontosítsa, illetve finomítsa.

4. feladat: Írjon egy olyan fájlt, melyben a betűméret egyesével növekszik! (Lásd: htmlpelda7.html) Apró „súgás”: sokat alkalmazza a másolás-beillesztés parancsokat!

HTML példa 7

Jogosan felmerül a kérdés, hogy ez milyen méretskála szerint van. Nos, ez a minden böngészőbe beépített alapértelmezett skála szerint értendő. Persze megengedett a betűméret szabályozása pl. képpontban vagy centiméterben, de ez nem szerencsés, mivel így nem lesz megfelelően rugalmas a képernyő átméretezése.

Bár nem szerencsés, de a betűk típusa is változtatható. Ehhez szintén a <FONT> tagre van szükség, de ezúttal a paramétere a SIZE helyett a FACE-re lesz szükség, de szeretném kihangsúlyozni, hogy ez nem minden esetben szerencsés, mivel lehet, hogy a honlap készítőjének gépen éppen megvan az a betűtípus, de a leendő felhasználóén nincsen! Mintapélda legyen a következő: (Lásd: htmlpelda8.html)

<html>
<font face="Arial">Arial</font>
<font face="Times New Roman">Times New Roman</font>
</html>

Ahhoz, hogy a betűformázás alapjait tisztán lássuk kellenek a színek is! Ehhez még mindig a megszokott FONT-ot használjuk, de ezúttal a COLOR paraméterrel. A színek nevei a legegyszerűbb angol szavak, pl.: black=fekete, blue=kék, green=zöld, red=piros, purple=lila, yellow=sárga, …

A színek nevei helyett használhatjuk azon RGB-kódjait is. Minden kódra a hagyományos 0-től 255-ig terjedő skála szolgál, de a számokat át kell írni 16-os számrendszerbe. Némi segítséget ad eme írás referenciája a kódok tekintetében. Link: ITT!

A fenti paraméterek keverhetők és össze is vonhatók. Nézzük például a következő fájlt: (Lásd: htmlpelda9.html)

<html>
<font face="Arial"><font size=4><font color="red">
Hosszabb megoldás</font></font></font><br>
<font face="Arial" size=4 color="red">Rövid megoldás</font>
</html>

5. feladat: Készítsen meghívót saját szülinapi bulijára, melyben legalább 5 betűtípus szerepeljen, legalább 5 különböző szín és legalább 5 eltérő méret is legyen! A lényeg: minél rikítóbb legyen!

 

Folytatása következik!