html-site

Lettergrootte met CSS

Q: Ik heb een website gebouwd met behulp van tabellen. Voor mijn lettertype gebruik ik de font-tag. Nu heb ik onlangs gemerkt dat bij mij de tekst mooi op het beeldscherm komt, maar dat het bij een vriend van me er absoluut niet mooi op komt.
Ik heb gekeken of er iets in zijn instellingen niet goed staat, bijvoorbeeld het lettertype op 'large', maar dat is niet het geval. Hoe komt dit, en wat kan ik er aan doen?

A: Wel, als je de <font> tag gebruikt dan kun je problemen krijgen met het controleren van je tekst. Ineens past het niet meer binnen je tabellen, of in een ander geval heb je een heel andere grootte dan de bedoeling was. De tag zet namelijk de grootte relatief neer op een basisgrootte. Dat hangt helemaal af van de instellingen van de browser van de bezoeker. Het probleem is alleen maar groter als je al ziet hoeveel verschil een MAC of een PC maken in lettergrootte en type.
Met CSS kun je dit probleem voorkomen. Als je deze methode namelijk gebruikt dan bepaal jij en niet de browser hoe de lettertype er uit ziet, de grootte, de dikte enzovoort. Om het probleem goed op te lossen is het handig een beetje te experimenteren met de stijl die voor je eigen website geschikt is. Je kunt voor het lettertype de volgende code binnen de <head> tag plaatsen:

<style type="text/css">
<!--
body {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px;}
-->
</style>



Met font-family bepaal je de zogenaamde familie waarbij het lettertype behoort. Met font-size bepaal je de grootte, dit kan in pixels (px), punten (pt), maar ook met large, x-large en dergelijke. Er zijn nog meer stijlen voor lettertypes, die kun je vinden in de cursus over stylesheets.

Transip