Avancerad textformatering
När man skriver kod i CSS så skriver man först börjar man med en selektor som i detta exempel nedan "body".
Sedan skriver man en måsvinge { och sedan den specifika koden för selektorn och avslutar med en måsvinge }.
<![CDATA[
body {
color: #fff;
}
]]>
I exemplet ovan ändrar vi bakgrundsfärgen för hemsidan. "Body" är som sagt en selektor. "Color" är för färgen i
selektorn. "#fff" är den hexadecimala koden för färgen vitt.
Nu ska vi gå in på lite mer avancerad text formatering! Om du vill formatera vanlig text använder du den här koden:
<![CDATA[
p {
font-family: Verdana;
}
]]>
Denna kod gör att alla paragrafer blir i typsnittet Verdana. Du kan också ange någon annan typsnitt om du vill.
Så klart kan du ändra mycket mer!
<![CDATA[
p {
font-family: Arial, sans serif;
font-size: 12px;
color: #0f0;
}
]]>
Detta ger alla paragrafer typsnittet Arial och om inte arial finns så väljer man en annan sans serif typsnitt.
Texten blir i 12 pixlar stor. Vi rekomenderar att du anger alla storlekar på webben i pixlar och inte annat.
Färgen på paragraf texten kommer att bli grön.
För att formatera rubriker:
<![CDATA[
h1 {
font-family: Verdana; font-size: 24px
}
]]>
Här har man angett att alla h1 rubriker ska formateras på detta sätt.
Du kan också formatera text länkar!
<![CDATA[
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:active {
text-decoration: none;
}
]]>
Detta kommer att plocka bort understrykningen på alla text länkar. "a:link" är för länkar. "a:visited" är besökta länkar.
"a:active" är för aktiva länkar. "a:hover" finns även om man vill att formateringen ska vara annorlunda när man för muspekaren
över länken.