font-size-adjust · 跟老司机学CSS3

**font-size-adjust** * 描述：设置小写字母 x 的高度与对象文字字号的比率。 * 版本：CSS3 * 继承性：有 **语法** ``` font-size-adjust：取值; ``` 取值 none：默认，如果此字体不可用，则不保持此字体的 x-height。 inherit：继承父元素的字体大小调整属性。 number ：定义字体的 aspect 值比率。 **使用说明** * 字体的 x-height（即，小写字母 'x' 的高度）与 font-size 高度的比值，称作该字体的 aspect值。 * 当一个字体不可用，浏览器使用第二个指定的字体。这可能会导致改变字体大小。为了防止这种情况，可以使用 font-size-adjust 属性。 * Times New Roman 字体比 Verdana 字体的 aspect 值要小，当使用备选字体时，必然会影响文本的易读性，甚至导致页面布局产生混乱。例如：Verdana 的 aspect 值是 0.58（意味着当字体尺寸为 100px 时，它的 x-height 是 58px）。Times New Roman 的 aspect 值是 0.46。只需把 font-size-adjust 属性的值，设置为首选字体的 aspect 值，就可以保证使用备选字体后，文本的显示尺寸不发生变化。 * 可用字体的字体尺寸 = 首选字体的字体尺寸 \* （font-size-adjust 值比率 / 可用字体的 aspect 值）例如：如果 14px 的 Verdana（aspect 值是 0.58）不可用，但是某个可用的字体的 aspect 值是 0.46，那么替代字体的尺寸将是 14 * (0.58/0.46) = 17.65px。 * 目前，仅得到 Firefox 浏览器的支持。 **代码示例** ``` <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>font-size-adjust</title> <style> #container .p1{ font: 14px/1.5 verdana, Times New Roman; font-size-adjust: 0.58; } </style> </head> <body> <div id="container"> <p class="p1">Css3 Coding</p> </div> </body> </html> ```