Запіс на курсы па HTML, CSS, JavaScript, PHP, Python, фрэймворкам і CMS,
а таксама: дапамога ў пошуку працы і заказаў, стажыроўка на рэальных праектах→
16 of 313 menu

Уласцівасць font-size-adjust

Уласцівасць font-size-adjust дазваляе кантраляваць памер шрыфту, пры нязменным font-size (павялічваць або памяншаць).

Прымяненне: хай у font-family зададзена два шрыфты праз коску, напрыклад, Georgia, "Times New Roman". Хай на камп'ютары карыстальніка няма шрыфту Georgia - у гэтым выпадку прыменіцца "Times New Roman". Аднак, нас чакае праблема - пры аднолькавым значэнні font-size шрыфты будуць выглядаць па-рознаму. У прыкладзе ніжэй абодвом абзацам зададзены font-size у 16px, але розныя font-family. Паглядзіце, як адрозніваюцца памеры:

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

:

Гэта адбываецца з-за таго, што які адлюстроўваецца памер шрыфту залежыць у большай ступені не ад уласцівасці font-size, якое вызначае толькі агульны памер шрыфту, а ад суадносін значэнняў уласцівасці font-size і велічыні x-height (x-height - гэта розніца паміж памерам малой літары "x" і вялікай літары "X" для пэўнага шрыфту).

Гэтыя суадносіны завуцца аспектам шрыфту і вылічаецца па формуле: аспект = font-size / x-height.

Праблему памераў вырашае ўласцівасць font-size-adjust (яно дазваляе мяняць аспект шрыфту), якое прымусіць выглядаць другі шрыфт такога ж памеру, як і першы.

Давайце зробім так, каб шрыфт Times New Roman быў такога ж памеру, як і Georgia. Нам вядомы аспект Georgia - гэта 0.5 (гл. табліцу ніжэй).

Усталюем font-size-adjust для тэксту з Times New Roman у значэнне 0.5 і ўбачым, што другі тэкст стаў такога ж памеру, як і першы:

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

:

Сінтаксіс

селектар { font-size-adjust: лік | none; }

Значэнні

Значэнне Апісанне
number Лік задае аспект шрыфту.
none Няма рэгуліроўкі памеру шрыфту.

Значэнне па змаўчанні: none.

Як вызначыць значэнне аспекту для шрыфту?

Паглядзіце ўрывак з спецыфікацыі W3C: Каэфіцыент прапарцыянальнасці (аспект) для абраных шрыфтоў можа быць вылічаны шляхам параўнання аднаго і таго ж тэксту, але з розным значэннем font-size-adjust. Калі значэнне ўласцівасці падабрана правільна, то пры аднолькавым памеры шрыфту тэкст застанецца нязменным для ўсіх ужываных на старонцы шрыфтоў.

Прывяду вядомыя мне значэнні аспекту для некаторых шрыфтоў: Georgia - 0.5, Times New Roman - 0.46, Verdana - 0.58.

Прыклад

Параўнайце як выглядае тэкст з розным значэннем font-size-adjust і аднолькавым font-size і 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>

:

Прыклад . Прымяненне ў рэальным жыцці

Код ніжэй робіць так, каб у выпадку адсутнасці на камп'ютары ў карыстальніка шрыфту Georgia, што прымяніўся шрыфт Times New Roman быў такога ж памеру, як і 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; }

:

byenru