font-family
字体格式。
请求到网页后,看到字体样式,先请求本地电脑字体库,如果没有就使用浏览器默认的。为了防止使用默认字体变丑的情况,可以在后边多写几个字体。
如果一定要下载自己的字体,可以用@font-face下载制定的字体。
font-style
字体样式,正常 & 斜体。
- normal 正常
- italic 斜体 使用设计时对应的斜体
- oblique 斜体 只是把字体倾斜
font-size
字体大小,顶线和底线的距离。默认16px,会被继承。
font-weight
字体粗细,默认:400,加粗为700;取值为1-1000;如果一定要动,最好取整百的值,只需要记住400 700两个值即可。
line-height
一行文字所占据的高度,常用来给文字高度居中。

- 行高:也就是line-height,指文本行基线间的垂直距离。上图任意两条相同颜色的垂直距离也是行高。
- 行距:是指一行底线到下一行顶线的垂直距离,即第一行粉线和第二行绿线间的垂直距离。
- 半行距:行距的一半。半行距 = (行高 - 字号) / 2。在 CSS 中的margin-top不是从文字的顶线算起,而是从顶线半行距的上方开始算起。同理,margin-bottom是从底线半行距的下方开始算起。
- x-height:x字高,是指字母的基本高度,精确地说,就是基线baseline和主线mean line之间的距离。
font
我们想给一个元素添加字体样式的话,如果按照一行行添加实在太多了;因此有一个简写,即font,可以用来作为 font-style, font-variant, font-weight, font-size, line-height 和 font-family 属性的简写。
- 必须包含以下值:
- 可以选择性包含以下值:
- font-style, font-variant 和 font-weight 必须在 font-size 之前
- 在 CSS 2.1 中 font-variant 只可以是 normal 和 small-caps
- line-height 必须跟在 font-size 后面,由 “/“ 分隔,例如 “16px/3”
- font-family 必须最后指定