目录
4:使用十六进制的rgb值来表示颜色，原理和上边RGB原理一样
5:HSL值（H - 色相 0-360,S - 饱和度 0-100%,L - 亮度 0-100%）
一.长度单位
1:像素 px
就是电脑屏幕上的一个个发光的小点，我们眼睛是看不出来,
像素是我们pc端最常用的一个单位，它是一个固定单位
2:百分比 %
是父元素的宽高的百分比，是一个相对单位，会随着父元素宽高的变化而变化
一般情况下，做流式布局比较多
3、em
也是一个相对单位，相对于当前元素的字体大小来计算最终大小，
也就是1em=1个font-size。如果当前的元素没有设置字体大小，
那么会继承祖先元素的字体大小，
最终继承到html默认的字体大小，是16px
4、rem
r root 根
也是一个相对单位，相对于根标签html的字体大小来计算最终大小
也就是1rem=1个html的font-size
二.颜色单位：
1:在CSS可以直接使用颜色的单词来表示不同的颜色
red、green、yellow、blank等
缺点：颜色单词太多了，不好描述
2:使用RGB值来表示不同的颜色
rgb(红色，绿色，蓝色)
颜色的值 0-255之间 0最小，255最大
直接用电脑或插件可以吸取颜色的比值，ctrl+alt+a
3:RGBA
rgba(red, green, blue, alpha)
alpha 透明度 0-1之间设置透明度 0是透明，1是不透明
4:使用十六进制的rgb值来表示颜色，原理和上边RGB原理一样
十六进制：0-9abcdef，
00表示最小，代替0-255的0，ff表示最大，代替0-255的255
用十六进制的值来表示0-255之间的数值，表示红色，绿色，蓝色的浓度
语法：#ff0000，像这样两两重复的表示，可以省略一位，简写成#f00
#f0f0f0 这样的是不可以省略
例子：#f00 #0f0 #00f #ccc #eee #333
5:HSL值（H - 色相 0-360,S - 饱和度 0-100%,L - 亮度 0-100%）
HSLA值 A - alpha 透明度 0-1之间
三.字体的样式
1:color 设置字体颜色,也可以设置其他颜色
2:font-size 设置字体大小
3:font-family 可以指定文字的字体
4:@font-face 自定义字体
四.字体的分类
在网页中将字体分成5大类：
serif ['serif]（衬线字体）
sans-serif（非衬线字体）
monospace （等宽字体）
cursive ['kə:siv]（草书字体）
fantasy ['fæntəsi]（虚幻字体）
可以将字体设置为这些大的分类,当设置为大的分类以后，
浏览器会自动选择指定的字体并应用样式
一般会将字体的大分类，指定为font-family中的最后一个字体 ,用来兜底
五.字体的其他样式
设置一个文字大小 font-size
设置一个字体 font-family
设置文字斜体 font-style: ;
可选值：
normal 默认值 文字正常显示
italic 文字倾斜 （比较常用）
oblique 文字倾斜 （了解）
设置文字的加粗
font-weight: ;
可选值：
normal 默认值 文字正常显示
bold 文字加粗
bolder 文字加粗
100-900 之间数值 100最细 900最粗 注意没有单位
设置一个小型大写字母
font-variant
可选值：
normal 默认值 文字正常显示
small-caps 设置小型大写字母
font简写
可以统一设置文字相关的一些样式
注意：
1、必须要有字体大小和文字的字体
2、字体大小必须在倒数第二位
文字字体必须在倒数第一位
六.行间距
1、行高（line height）
文字占有的实际高度
行高=上间距+文字的大小+下间距
上间距=下间距
如果要设置行与行之间的空白距离，可以通过设置行高来实现
line-height样式名
可选值：
（1）、直接写大小，单位：px/em/rem/%
（2）、直接写倍数，1/2/3/4/5····，是当前字体大小的倍数
（3）、可以写百分比，100%，200%。300%
2、单行文本在父元素中垂直居中
只需要设置行高跟父元素高度一致
3、font中也可以指定行高
font: 字体大小/行高 字体
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
