Teckensnittsfamiljerna i CSS

När vi ändå är inne på fonter och teckensnitt, kan jag passa på att presentera de fem teckensnittsfamiljerna i CSS. I en teckensnittsfamilj samlas alla teckensnitt med liknande utformning och stil i en grupp (familj).

Att ange en teckensnittsfamilj efter det eller de teckensnittsnamn du angett, är standard i CSS. Din stilmall får alltså en anmärkning om detta vid valideringen, om teckensnittsfamiljen saknas. Så här använder du teckensnittsfamiljerna i din stilmall.

Teckensnitt

Ett teckensnitt är en uppsättning skrivtecken (bokstäver, siffror m.m.) i en speciell stil. Varje teckensnitt har ett namn. Genom att ange flera teckensnittsnamn i CSS-filen, ges flera alternativ för webbläsaren att visa sidan om det första teckensnittet saknas hos besökaren.

Sist, efter alla teckensnittsnamn du räknar upp, ska du ange den teckensnittsfamilj de tillhör. Webbläsaren kan då ta något annat liknande teckensnitt om alla de namngivna saknas.

body { font-family:arial,verdana,helvetica,sans-serif }

Teckensnittsfamiljerna är

  • Seriffer
  • Sans-seriffer
  • Kursiva stilar
  • Tecken med fastställd bredd
  • Fantasistilar

Seriffer

Teckensnitt med ”fötter” och ”vingar” som exempelvis Times New Roman eller Georgia har. Lättlästa i löpande text på trycksaker, men aningen mer svårlästa på bildskärm. I CSS heter denna famlj serif.

Sans-seriffer

Teckensnitt utan seriffer samlas i denna familj. Några exempel vanliga på webben är Arial, Verdana och Trebuchet MS. I CSS anges denna familj med namnet sans-serif.

Kursiva stilar

Kursiverad text lutar åt höger och kallas som CSS-egenskap italic eller oblique. Exempel på denna stil är Monotype Corsiva eller Lucida Calligraphy. Teckensnittsfamiljen heter cursiv.

Tecken med fast teckenbredd

I tidiga HTML-versioner kunde denna textstil åstadkommas med taggen <tt> (tele type). Numera anger man teckensnittsfamiljen monospace i CSS-filen istället. Ett vanligt exempel på denna stil är Courier New, som nästan alla texteditorer använder sig av. En tacksam stil att skriva kod i eftersom tabbsteg anges i ett visst antal mellanslag och alla tecken och mellanslag är exakt lika breda.

Fantasistilar

Alla extrema och fantasifulla stilar som inte platsar i någon av de andra familjerna, går under namnet fantasy i CSS. Många sådana här teckensnitt är ”hemtillverkade” och kan laddas hem gratis på olika sajter. Så länge ett teckensnitt inte finns som standard i Windows-installationen blir det också genast svårare att använda.

Font families

Tid 2009-05-29 (10:12) Kategori XHTML och CSS

Kommentarer till “Teckensnittsfamiljerna i CSS” (1)

  1. Teckensnittsfamiljerna i CSS | Teckensnitt.se | 2009-05-29 (15:14)

    [...] More here: Teckensnittsfamiljerna i CSS [...]

Kommentera inlägget