1em är alltid detsamma som teckensnittets aktuella storlek.
Standardstorleken för teckensnitt i de flesta webläsare är 16 pixlar.
Testa!
Förstora eller förminska texten manuellt i din webläsare!
Det gör du i de flesta fall genom att välja: Visa / Textstorlek.
Eller via tangentbordet: ctrl+plus / ctrl+minus (fungerar inte i Internet Explorer).
| CSS: |
|---|
body { font-family: Verdana; font-size: 75%; }
|
• Här förändras storleken på teckensnittet - så att det gäller för hela sidan om man inte anger annat.
• Eftersom vi utgår från att fontstorlekens standard är 16px kommer - font-size: 75% - att motsvara 12px ( 75% av 16 är 12 ) - om man inte förändrar textstorleken i webläsaren eller anger något annat.
• När det gäller teckensnittets storlek är 1em alltid detsamma som 100%.
• På den här sidan gäller alltså att 1em motsvarar 12px på samma gång som 100% också motsvarar 12px (när det gäller teckensnittets storlek).
• Scrolla ner för att se exempel!
font-size: 18px
font-size: 16px
font-size: 14px
font-size: 12px
font-size: 11px
font-size: 10px
font-size: 1em
Den här texten har storleken 1em - vilket här motsvarar 12px (när man inte förändrat textstorleken i webläsaren).
font-size: 100%
Den här texten har storleken 100% - vilket motsvarar 12px (när man inte förändrat textstorleken i webläsaren) - eftersom man här dragit ner fontstorleken för sidan till 75%.
font-size: 0.9em
Den här texten har storleken 0.9em - vilket här motsvarar ungefär 11px (när man inte förändrat textstorleken i webläsaren).