Vlastnosť font-size-adjust

Vlastnosť font-size-adjust umožňuje kontrolovať veľkosť písma pri nezmenenej hodnote font-size (zväčšovať alebo zmenšovať).

Aplikácia: predpokladajme, že v font-family sú zadané dva fonty oddelené čiarkou, napríklad Georgia, "Times New Roman". Predpokladajme, že používateľovi v počítači chýba font Georgia - v tomto prípade sa použije "Times New Roman". Avšak, čelíme problému - pri rovnakej hodnote font-size budú fonty vyzerať rozdielne. V príklade nižšie je pre oba odseky nastavený font-size na 16px, ale rôzne font-family. Pozrite sa, ako sa veľkosti líšia:

<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>

K tomu dochádza preto, že zobrazovaná veľkosť písma závisí vo väčšej miere nie od vlastnosti font-size, ktorá definuje iba celkovú veľkosť písma, ale od pomeru hodnôt vlastnosti font-size a veľkosti x-height (x-height - je to rozdiel medzi veľkosťou malého písmena "x" a veľkého písmena "X" pre daný font).

Tento pomer sa nazýva aspekt fontu a vypočíta sa podľa vzorca: aspekt = font-size / x-height.

Problém s veľkosťami rieši vlastnosť font-size-adjust (umožňuje meniť aspekt fontu), ktorá donúti druhý font vyzerať rovnako veľký ako prvý.

Urobme tak, aby font Times New Roman bol rovnako veľký ako Georgia. Poznáme aspekt Georgie - je to 0.5 (pozri tabuľku nižšie).

Nastavme font-size-adjust pre text s Times New Roman na hodnotu 0.5 a uvidíme, že druhý text sa stal rovnako veľký ako prvý:

<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>

Syntax

selektor {
	font-size-adjust: číslo | none;
}

Hodnoty

Hodnota	Popis
`number`	Číslo určuje aspekt fontu.
`none`	Žiadna úprava veľkosti písma.

Predvolená hodnota: none.

Ako určiť hodnotu aspektu pre font?

Pozrite si úryvok zo špecifikácie W3C: Faktor proporcionality (aspekt) pre vybrané fonty môže byť vypočítaný porovnaním toho istého textu, ale s rôznou hodnotou font-size-adjust. Ak je hodnota vlastnosti zvolená správne, tak pri rovnakej veľkosti písma text zostane nezmenený pre všetky použité fonty na stránke.

Uvádzam známe hodnoty aspektu pre niektoré fonty: Georgia - 0.5, Times New Roman - 0.46, Verdana - 0.58.

Príklad

Porovnajte, ako vyzerá text s rôznou hodnotou font-size-adjust a rovnakým font-size a 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>

Príklad . Aplikácia v reálnom živote

Kód nižšie zaručuje, že v prípade absencie fontu Georgia v počítači používateľa, sa použitý font Times New Roman zobrazí rovnako veľký ako 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;
}