font-size-adjust

font-size-adjust 为元素规定 aspect 值。

 

语法

/* 仍使用font size的值 */
font-size-adjust: none;

/* 使用小写字母大小为font size一半大小的字体大小 */
font-size-adjust: 0.5;

描述
none仅根据font-size属性决定字体大小。
number根据使小写字母大小(根据字体的x-height–西文字体设计中的基线与主线的距离–决定)为该值乘以font-size的结果定义字体。

例子

HTML

<p> CSS Examples: font-size-adjust</p>
<br>
<div class="times"> This is the Times font (10px) which is hard to read in small sizes</div>
<p>
<div class="verdana"> This is the Verdana font (10px) which does much better, since it is a sans - serif font.</div>
<br>
<p> Now we 'll do an adjustment:</p>
<p>
<div class="adjtimes"> and the 10px Times, adjusted to the same aspect ratio as the Verdana. Cool, eh?</div>

CSS

.times {
    font-family: Times, serif;
    font-size: 10px;
}

.verdana {
    font-family: Verdana, sans-serif;
    font-size: 10px;
}

.adjtimes {
    font-family: Times, sans-serif; 
    font-size-adjust: 0.58;
    font-size: 10px;
}

执行结果

CSS Examples: font-size-adjust


This is the Times font (10px) which is hard to read in small sizes

This is the Verdana font (10px) which does much better, since it is a sans - serif font.

Now we 'll do an adjustment:

and the 10px Times, adjusted to the same aspect ratio as the Verdana. Cool, eh?

参考

相关链接

外部链接