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.

Ik geloof je heus wel!

Je zit echt niet te wachten op weer een saaie nieuwsbrief...
Met allerlei oninteressante informatie.
Maar echt, als je mijn mails probeert, dan beloof ik je te helpen met de zoektocht naar jouw perfecte niche! Zodat jij een website kunt maken rond jouw favoriete onderwerp of idee!
En je krijgt meteen toegang tot mijn gratis downloads. Proberen? Meld je hieronder aan!

Geef een reactie

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *