一、调整字体值的顺序：
大多数允许使用多个关键字的CSS属性都允许以任何顺序书写关键字（例如：background），但font属性是很少见的例外之一，它不仅对最基本的关键字组合有限制，还要求按照特定的顺序进行书写。必须按照先字号font-size，然后是字体族font-family。如果颠倒了顺序，或者漏掉了其中的一个，则任何现代浏览器都会完全忽略这条声明。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Sub-Pixel</title>
<style type="text/css">
p { font: "微软雅黑"; }
</style>
</head>
<body>
<p>Css 3实用指南</p>
</body>
</html>
p { font: 14px "微软雅黑"; }
p { font: bold italic 14px "微软雅黑"; }二、玩转行高：
字体的属性至少要包含两个值，并且必须以“先字号后字体族”的顺序，而且有时候我们也可以在字号值上放一个可选的行高值来作为字号的某种复数值。它看起来就像这样：
font: 100%/2.5 "微软雅黑";p { font: 100%/2.5 "微软雅黑"; border:1px solid #000;}显示效果如下：
当去掉100%后面的/2.5后看下面的效果：
三、无单位的行高值
line-height（行高）属性即可以接受无单位的数值，也可以使用带单位的行高值——一般情况下不推荐这门做。
那么它们之间有什么区别呢？当你定义了一个有单位的值，例如1em或者100%时，就会将计算后的行高值传给全部的后代元素。例如将下面的CSS应用到包含下列标记的文档中：
ul {font-size: 15px; line-height: 1em;}
li {font-size: 10px;}
small {font-size: 80%;}
<ul>
<li>I'm a list item with <small>small text</small>.</li>
</ul>ul {font-size: 15px; line-height: 1em;}
li {font-size: 10px; line-height: 15px;}
small {font-size: 80%; line-height: 15px;}现在我们拿掉行高值的em单位，则样式变成：
ul {font-size: 15px; line-height: 1;}
li {font-size: 10px;}
small {font-size: 80%;}现在传给后代元素的是这个原始数字，用来表示后代元素所使用的一个换算系数（比如一个乘数），而不是计算后的结果值。
因此，所有继承了这个1的元素会把这个值同它们的字号计算值相乘，声明了font-size: 10px的列表项元素会有一个10px的计算后的行高值，并且会将这个1传给small元素，而small元素也会把这个值与自身的计算字号值相乘，因此这个8px的字号计算后得到的行高值也是8px。最终效果与下面的等效：
ul {font-size: 15px; line-height: 1;}
li {font-size: 10px; line-height: 10px;}
small {font-size: 80%; line-height: 8px;}
扫一扫
1264
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
