css字体样式

长度单位

1:像素 px

其实就是一个个发光的小点，肉眼是看不到的，是个固定（绝对）单位

2:百分比 %

它是个相对单位，相对于其父元素的宽度变化而变化，一般情况可以用来做流动式布局

3.em

也是个相对单位，它相对于自身字体大小的变化而变化，如果自身没有设置字体大小，就会继承其父元素或者祖先元素的字体大小，直到继承根标签（html）的字体大小,如果根标签没有设置字体大小，html根标签默认的字体大小是16px

4.rem

也是个相对单位，它是相对于根标签（html）标签的字体大小变化而变化,如果根标签没有设置字体大小

颜色单位

1.单词法

在CSS可以直接使用颜色的单词来表示不同的颜色red green yello black等等

但不同的颜色单词种类繁多，也不好拼写，不好描述，所以不推荐使用

2.RGB法

使用RGB值来表示不同的颜色

语法： rgb(red, green, blue)

分别以红色，绿色，蓝色三种颜色为基本色，根据不同的浓度值来勾兑出不同的颜色

浓度的范围：0-255，0最小的，255最大的

获取颜色：来到截屏的模式，将鼠标箭头对准你要的颜色，然后进行提取即可，

注意提取的颜色格式，不一定是rgb语法，也有可能是16进制的写法

3.RGBA

语法：rgba(red, green, blue, alpha)

alpha：透明度 0-1之间 0表示透明，1表示不透明

4.十六进制

使用十六进制的rgb值来表示颜色，原理和上边RGB原理一样

语法：#红色浓度绿色浓度蓝色浓度

浓度值也是0-255，只不过用16进制的写法

16进制：0-9abcdef

例如：#00ff00,像这种两两重复的写法，可以省略一位，

简写#0f0 #0f0f0f,像这种就不可以简写

字体的分类：

serif ['serif]（衬线字体）

sans-serif（非衬线字体）

monospace （等宽字体）

cursive ['kə:siv]（草书字体）

fantasy ['fæntəsi]（虚幻字体）

可以将字体设置为这些大的分类,当设置为大的分类以后，浏览器会自动选择指定的字体并应用样式 一般会将字体的大分类，指定为font-family中的最后一个字体 ,用来兜底

字体的样式

1.color

设置字体颜色,也可以设置其他颜色

2.font-size

设置字体的大小

3.font-family

可以指定文字的字体.有关字体，设计师会提前设计好

4.@font-face

可以自定义使用非电脑自带字体

使用步骤:

（1）、先自定，设置好字体

（2）、去使用即可

5.font-style

设置文字斜体

可选值：

normal 文字正常显示 默认值

italic 设置斜体

oblique 设置斜体

6.font-weight

设置文字的加粗

可选值：

normal 文本正常显示，默认值

bold 加粗

bolder 加粗

100-900 100最细，900最粗

7. font-variant

设置一个小型大写字母

可选值：

normal 文本正常显示，默认值

small-caps 将字母变成小型大写字母

8.font简写

注意：

(1)字体相关的样式值设置，需要以空格隔开

(2)必须要写字体大小和字体

(3)字体的大小必须在倒数第二位，字体必须在倒数第一位

行高（line height）

文字占有的实际高度 .行高=上间距+字体大小+下间距,而且 上间距=下间距，所以我们也可以通过控制行高，来设置垂直方向，文字之间距离

line-height:; 设置行高

可选值：

（1）、直接长度单位 60px

（2）、直接写数字 1/2/3···· 是当前字体大小的倍数

（3）、写百分比 100%/200%/300%····

单行文本在父元素中垂直居中只需将行高设置与元素高度一致即可

font中也可以指定行高

语法： font:字体大小/行高 字体;