css字体样式（FontStyle）属性

css字体样式（FontStyle）属性
css⽂本样式
序号中⽂说明标记语法
1字体样式{font:font-style font-variant font-weight font-size font-family}
2字体类型{font-family:"字体1","字体2","字体3",...}
3字体⼤⼩{font-size:数值|inherit| medium| large| larger| x-large| xx-large| small| smaller| x-small| xx-small} 4字体风格{font-style:inherit|italic|normal|oblique}
5字体粗细{font-weight:100-900|bold|bolder|lighter|normal;}
6字体颜⾊{color:数值;}
7阴影颜⾊{text-shadow:16位⾊值}
8字体⾏⾼{line-height:数值|inherit|normal;}
9字间距{letter-spacing:数值|inherit|normal}
10单词间距{word-spacing:数值|inherit|normal}
11字体变形{font-variant:inherit|normal|small-cps }
12英⽂转换{text-transform:inherit|none|capitalize|uppercase|lowercase}
13？{font-size-adjust:inherit|none}
14？{font-stretch:condensed|expanded|extra-condensed|extra-expanded|inherit|narrower|normal| semi-condensed|semi-expanded|ultra-condensed|ultra-expanded|wider}
1. 字体样式：font
语法：{font:font-style font-variant font-weight font-size font-family}
[ <字体风格> || <字体变形> || <字体加粗> ]? <字体⼤⼩> [ / <⾏⾼> ]? <字体类形>
作⽤：简写属性，提供了对字体所有属性进⾏设置的快捷⽅法。

注意：字体样式⽤作不同字体属性的略写，特别是⾏⾼。

例如 P { font: italic bold 12pt/14pt Times, serif }指定该段为bold(粗体)和italic(斜体)Times或serif字体，12点⼤⼩，⾏⾼为14点。

例⼦：字体字体
2. 字体类形：font-family
语法：{font-family:字体1,字体2,字体3,...}
作⽤：调⽤客户端字体
说明：
·当指定多种字体时，⽤“，”分隔每种字体名称。

·当字体名称包含两个以上分开的单词时，⽤“”把该字体名称括起来。

·当样式规则外已经有“”时，⽤‘’代替“”。

注意：如果在font-family后加上多种字体的名称，浏览器会按字体名称的顺序逐⼀在⽤户的计算机⾥寻找已经安装的字体，⼀旦遇到与要求的相匹配的字体，就按这种字体显⽰⽹页内容，并停⽌搜索；如果不匹配就继续搜索，直到找到为⽌，万⼀样式表⾥的所有字体都没有安装的话，浏览器就会⽤⾃⼰默认的字体来替代显⽰⽹页的内容。

例⼦：{font-family:⿊体,⾪书;} 字体类型
3．字体⼤⼩：font-size
语法：{font-size:数值|inherit| medium| large| larger| x-large| xx-large| small| smaller| x-small| xx-small}
作⽤：设定⽂字⼤⼩，参考取值单位
说明：使⽤⽐例关系
·xx-small
·x-small
·small
·medium
·large
·x-large
·xx-large
例⼦：{font-size:18pt;} 字体⼤⼩
4. 字体风格：font-style
语法：{font-style:inherit|italic|normal|oblique}
作⽤：使⽂本显⽰为扁斜体或斜体等表⽰强调
说明：
·inherit　继承
·italic 斜体
·normal　正常
·oblique　偏斜体
5．字体粗细：font-weight
语法：{font-weight:100-900|bold|bolder|lighter|normal;}
作⽤：设定⽂字的粗细
说明：
·bold 粗体(相当于数值700 )
·bolder 特粗体
·lighter 细体
·normal 正常体(相当于数值400)
注意：取值范围从数字100~900，浏览器默认的字体粗细为400。

另外可以通过参数lighter和bolder使得字体在原有基础上显得更细或更粗些。

6. 字体颜⾊：color
语法：{color: 数值}
作⽤：字体颜⾊
说明：颜⾊参数取值范围
·以RGB值表⽰
·以16进制（hex）的⾊彩值表⽰
·以默认颜⾊的英⽂名称表⽰
注意：以默认颜⾊的英⽂名称表⽰⽆疑是最为⽅便的，但由于预定义的颜⾊种类太少，所以更多的⽹页设计者喜欢⽤RGB的⽅式。

RGB⽅式的好处很多，不但可以⽤数字的形式精确地表⽰颜⾊，⽽且也是很多图像制作软件（如Photoshop）⾥默认使⽤的规范，这样⼀来就为图⽚和⽹页更好地结合打下了坚实的基础。

7. ⽂字阴影颜⾊：text-shadow
语法：{text-shadow:16位⾊值}
说明：好像不起作⽤?
例⼦：中国中国
8. 字体⾏⾼
语法：{line-height:数值|inherit|normal}
作⽤：⾏与⾏之间的距离
说明：取值范围
·不带单位的数字：以1为基数，相当于⽐例关系的100%
·带长度单位的数字：以具体的单位为准
·⽐例关系
注意：⾏距是指上下两⾏基准线之间的垂直距离。

⼀般地说，英⽂五线格练习本，从上往下数的第三条横线就是计算机所认为的该⾏的基准线。

如果⽂字字体很⼤，⽽⾏距相对较⼩的话，可能会发⽣上下两⾏⽂字互相重叠的现象。

9. 字间距：letter-spacing
语法：{letter-spacing:数值|inherit|normal}
作⽤：控制⽂本元素字母间的间距，所设置的距离适⽤于整个元素。

注意：数值 - 设置字间距长度，正值表⽰加进⽗元素中继承的正常长度，负值则減去正常长度。

在数字后指定度量单位：
ex(⼩写字母x的⾼度), em(⼤写字母M的宽度)。

例⼦：中国china 中国china
10. 单词间距：word-spacing
语法：{word-spacing:数值|inherit|normal}
说明：单词间距指的是英⽂每个单词之间的距离，不包括中⽂⽂字。

间隔距离的取值：points、em、pixes、in、cm、mm、pc、ex、normal等。

11. 字体变形：font-variant
语法：{font-variant:inherit|normal|small-cps
作⽤：⽤于正常和⼩型⼤写字母间切换(⽐正常⼤写字母略⼩)
说明：small-caps ⼩型⼤写字母
7. 字母⼤⼩写转换：text-transform
语法：{text-transform:inherit|none|capitalize|uppercase|lowercase}
作⽤：设置⼀个或⼏个字母的⼤⼩写标准。

说明：
·none 不改变⽂本的⼤写⼩写。

·capitalize　元素中毎个单词的第⼀个字母⽤⼤写。

·uppercase　将所有⽂本设置为⼤写。

·lowercase　将所有⽂本设置为⼩写。

例⼦：china abcd　china abcd
13. font-size-adjust
语法：{font-size-adjust:inherit|none}
作⽤：不详
14. font-stretch
语法：{font-stretch:condensed | expanded | extra-condensed | extra-expanded | inherit | narrower | normal |
semi-condensed | semi-expanded | ultra-condensed | ultra-expanded | wider}
作⽤：不详
更详细的可以到这⾥查看：https:///w3school/css/pr_font_font.htm。