0基础学web前端第4天：CSS

3.CSS字体样式属性调试工具

3.1 font-size:大小

font-size属性用于设置字号。

p  {
  font-size:20px;
}

单位：可以使用相对长度单位，也可以使用绝对长度单位。相对长度单位比较常用，推荐使用像素单位px，绝对长度单位使用较少。

我们文字大小以后，基本就用px了，其他单位很少使用。谷歌浏览器默认的文字大小为16px。但是不同浏览器可能默认显示的字号大小不一致，我们尽量给一个明确值大小，不要默认大小。一般给body指定整个页面文字的大小。

3.2  font-family:字体

font-family属性用于设置哪一种字体。

p{ font-family:"微软雅黑";}

网页中常用的字体有宋体、微软雅黑、黑体等，例如将网页中所有段落文本的字体设置为微软雅黑。可以同时指定多个字体，中间以逗号隔开，表示如果浏览器不支持第一个字体，则会尝试下一个，直到找到合适的字体， 如果都没有，则以我们电脑默认的字体为准。

p{font-family: Arial,"Microsoft Yahei", "微软雅黑";}

CSS Unicode字体

为什么使用 Unicode字体？在 CSS 中设置字体名称，直接写中文是可以的。但是在文件编码（GB2312、UTF-8 等）不匹配时会产生乱码的错误。xp 系统不支持 类似微软雅黑的中文。

解决方案：

方案一： 你可以使用英文来替代。 比如` font-family:"Microsoft Yahei"`。

方案二： 在 CSS 直接使用 Unicode 编码来写字体名称可以避免这些错误。使用 Unicode 写中文字体名称，浏览器是可以正确的解析的。

为了照顾不同电脑的字体安装问题，我们尽量只使用宋体和微软雅黑中文字体。

3.3  font-weight:字体粗细

在html中如何将字体加粗我们可以用标签来实现。使用 b 和 strong 标签是文本加粗。可以使用CSS 来实现，但是CSS 是没有语义的。

我们平时更喜欢用数字来表示加粗和不加粗。

3.4  font-style:字体风格

在html中如何将字体倾斜我们可以用标签来实现。字体倾斜除了用 i 和 em 标签，可以使用CSS 来实现，但是CSS 是没有语义的。font-style属性用于定义字体风格，如设置斜体、倾斜或正常字体，其可用属性值如下：

平时我们很少给文字加斜体，反而喜欢给斜体标签（em，i）改为普通模式。

3.5  font:综合设置字体样式

font属性用于对字体样式进行综合设置。

基本语法：

选择器 { font: font-style  font-weight  font-size/line-height  font-family;}

使用font属性时，必须按上面语法格式中的顺序书写，不能更换顺序，各个属性以空格隔开。

其中不需要设置的属性可以省略（取默认值），但必须保留font-size和font-family属性，否则font属性将不起作用。

3.6  font总结