Egenskaben font-size-adjust
Egenskaben font-size-adjust giver mulighed for
at kontrollere skriftstørrelsen, ved uændret
font-size
(forøge eller formindske).
Anvendelse: lad der i font-family
være angivet to skrifttyper adskilt af komma, for eksempel,
Georgia, "Times New Roman". Lad
der på brugerens computer ikke være skrifttypen Georgia
- i dette tilfælde vil "Times New Roman" blive anvendt.
Imidlertid står vi over for et problem - ved samme
værdi af font-size
vil skrifttyperne se forskellige ud. I eksemplet
nedenfor er font-size
for begge afsnit sat til 16px, men med forskellige font-family.
Se hvor forskellige størrelserne er:
<p style="font-size: 16px; font-family: Georgia;">
Lorem ipsum dolor sit amet.
</p>
<p style="font-size: 16px; font-family: 'Times New Roman';">
Lorem ipsum dolor sit amet.
</p>
:
Dette sker fordi den viste
skriftstørrelse i højere grad afhænger, ikke
af egenskaben font-size,
som kun definerer den generelle skriftstørrelse,
men af forholdet mellem værdierne for egenskaben font-size
og størrelsen x-height (x-height
- er forskellen mellem størrelsen på det lille bogstav
"x" og store bogstav "X" for en bestemt
skrifttype).
Dette forhold kaldes aspekt for skrifttypen og beregnes med formlen: aspekt = font-size / x-height.
Egenskaben font-size-adjust løser størrelsesproblemet
(den giver mulighed for at ændre skrifttypens aspekt), og
får den anden skrifttype til at se lige så stor ud
som den første.
Lad os gøre så skrifttypen Times
New Roman bliver lige så stor som
Georgia. Vi kender aspektet for Georgia
- det er 0.5 (se tabellen nedenfor).
Lad os sætte font-size-adjust for teksten
med Times New Roman til værdien 0.5
og vi vil se, at den anden tekst blev lige så
stor som den første:
<p style="font-size: 16px; font-family: Georgia;">
Lorem ipsum dolor sit amet.
</p>
<p style="font-size: 16px; font-family: 'Times New Roman'; font-size-adjust: 0.5;">
Lorem ipsum dolor sit amet.
</p>
:
Syntaks
selektor {
font-size-adjust: tal | none;
}
Værdier
| Værdi | Beskrivelse |
|---|---|
number |
Tal angiver skrifttypens aspekt. |
none |
Ingen regulering af skriftstørrelsen. |
Standardværdi: none.
Hvordan bestemmes aspektværdien for en skrifttype?
Se uddrag fra W3C-specifikationen:
Proportionalitetsfaktoren (aspekt) for
udvalgte skrifttyper kan beregnes ved at
sammenligne den samme tekst, men med forskellig
værdi af font-size-adjust. Hvis værdien
for egenskaben er valgt korrekt, så forbliver teksten
uændret ved samme skriftstørrelse for alle
anvendte skrifttyper på siden.
Her er de værdier for aspekt, som jeg kender for
nogle skrifttyper: Georgia - 0.5,
Times New Roman - 0.46, Verdana -
0.58.
Eksempel
Sammenlign hvordan tekst ser ud med forskellig værdi af
font-size-adjust og samme font-size
og font-family:
<p style="font-size: 16px; font-family: 'Times New Roman'; font-size-adjust: none;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</p>
<p style="font-size: 16px; font-family: 'Times New Roman'; font-size-adjust: 0.5;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</p>
<p style="font-size: 16px; font-family: 'Times New Roman'; font-size-adjust: 0.6;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</p>
:
Eksempel . Anvendelse i det virkelige liv
Koden nedenfor gør, at i tilfælde af fravær
af skrifttypen Georgia på brugerens computer,
vil den anvendte skrifttype Times New Roman
have samme størrelse som Georgia:
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elitorire
aenean a dapibus magna, ac interdum nisl suspendisse egetile.
</p>
p {
font-size: 16px;
font-family: Georgia, "Times New Roman";
font-size-adjust: 0.5;
}
:
