HTML (HyperText Markup Language) proporciona sis etiquetes especials per mostrar encapçalaments de diferents nivells. Tots tenen paràmetres predeterminats (mida i estil de la font, la quantitat de sagnats dels elements anterior i següent, etc.). Aquestes opcions es poden anul·lar mitjançant instruccions CSS (Fulls d'estil en cascada) i, per tant, canvien l'aparença dels encapçalaments al text d'una pàgina web.
Instruccions
Pas 1
Col·loqueu encapçalaments de diferents nivells entre les etiquetes d'obertura i de tancament corresponents, si encara no s'ha fet al codi font de la pàgina web. Per exemple, l'encapçalament més important (primer nivell) hauria d'estar entre etiquetes
i
:
Encapçalament de primer nivell
El següent subtítol de nivell més important s’ha de situar entre etiquetes
i
etc. L’últim dels nivells previstos és el sisè -
i
Pas 2
Col·loqueu a la part de la capçalera del codi font (entre les etiquetes i) una declaració que indiqui al navegador del visitant que hi ha una descripció dels estils a CSS en aquest lloc:
/ * Les instruccions CSS seran aquí * /
Pas 3
Entre les etiquetes d'estil d'obertura i de tancament, afegiu descripcions d'estil per als encapçalaments de cada nivell del qual vulgueu canviar l'aspecte. Per exemple, si només heu de canviar l'aspecte dels títols de primer nivell, aquest codi pot tenir aquest aspecte:
h1 {
color: vermell;
mida de la lletra: 20 px;
estil de lletra: cursiva;
font-pes: negreta;
marge superior: 30 px;
marge-fons: 20 px;
}
Aquí, h1 indica que la descripció entre claudàtors es refereix a l’etiqueta h1 i s’anomena "selector". El paràmetre de color defineix el color del text, el paràmetre mida de la font és la mida de la font, l’estil de la font amb el valor de cursiva és la tipografia de cursiva, el pes de la font amb el valor en negreta és en negreta, la part superior del marge és la part superior marge i marge inferior és el marge inferior. Per als encapçalaments de segon nivell, afegiu un bloc similar amb un selector h2, etc.
Pas 4
Utilitzeu la sintaxi abreujada si hi ha molts nivells per descriure. Per exemple, les descripcions de tipus de lletra es poden col·locar en un paràmetre, així com les mides de sagnat. Mostra:
h1 {
color: vermell;
font: negreta 20px arial;
marge: 30px 0 20px 0;
}
h2 {
color: taronja;
font: negreta 18px arial;
marge: 25px 0 15px 0;
}
Al paràmetre de marge, els marges s’han d’especificar en el sentit de les agulles del rellotge, començant pel marge superior, a través d’un espai (superior dret inferior esquerre).