CSS基础知识点font字体

style里：

属性和属性值之间用英文“:”连接。

多个“键值对”之间用英文“;”进行区分。

css里面的注释是/* */

html里面的注释是<!-- -->

 

字体样式属性:

各种字体之间必须使用英文状态下的逗号隔开。

中文字体需要加英文状态下的引号，英文字体一般不需要加引号。当需要设置英文字体时，英文字体名必须位于中文字体名之前。

如果字体名中包含空格、#、$等符号，则该字体必须加英文状态下的单引号或双引号，例如font-family: "Times New Roman";。

 

Unicode字体

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

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

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

font-family: "\5FAE\8F6F\96C5\9ED1"，表示设置字体为“微软雅黑”。

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

 

font-weight：字体粗细

font-weight属性用于定义字体的粗细，其可用属性值：normal、bold、bolder、lighter、100~900（100的整数倍）。

数字 400 等价于 normal，而 700 等价于 bold。

让粗体变得不粗： strong{font-weight:normal;}

 

font-style:字体风格

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

em{font-style:normal}

 

font:综合设置字体样式

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

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

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

 

开发者工具（chrome）

此工具是我们的必备工具，以后代码出了问题，我们首先第一反应就是：“按F12”或者是 “shift+ctrl+i” 打开 开发者工具。

1. ctrl+滚轮 可以 放大开发者工具代码大小。

2. 左边是HTML元素结构 右边是CSS样式。

3. 右边CSS样式可以改动数值和颜色查看更改后效果。