这是我参与「第四届青训营 」笔记创作活动的的第5天
颜色
在CSS中可以直接使用颜色来设置，但是这样使用是不方便的，有些需要调色处理
RGB值
每一种颜色的值在0-255（0%-100%）之间
语法： RGB(红色，绿色，蓝色)
RGBA值
语法：RGBA（红色，绿色，蓝色，不透明度0-1）
HSL值
- H:色相 （0-360）
- S:饱和度 (0%-100%)
- L:亮度 (0%-100%)
示例
文档流
网页是一个多层的机构，一层压一层，CSS可以为每一层设置样式，用户只看到最上面的一层。这些层中，最底下的一层叫文档流，文档流是网页的基础。我们所创建的元素默认都在文档流中进行排列
对于我们来说元素主要有两个状态:
- 在文档流中
- 不在文档流中
元素在文档流中有何特点：
块元素
- 块元素会独占一行
- 默认宽度是父元素的全部
- 默认高度是被子元素撑开
行内元素
- 行内元素不会独占一行，自左向右水平排列
- 如果一行之中不足以容纳所有的行内元素，会换到第二行继续自左向右
- 行内元素的宽度和高度都是被内容撑开
盒模型
CSS将页面中所有元素都设置成了一个矩形，对网页的布局就是对矩形的摆放。
每个盒子都有以下几部分组成：
- 内容区(content)
- 内边距（padding）
- 边框（border）
- 外边距（margin）
内容区
元素中所有的子元素和文本内容都是在内容区中排列
大小由width和height设定
边框
边框的大小会影响盒子的大小
设置需要三个样式：
- 边框的宽度：
border-width - 边框的颜色：
border-color - 边框的样式：
border-style
边框的宽度
可以用来指定四个方向的边框宽度：
值的顺序：
- 四个值：上 右 下 左
- 三个值：上 左右 下
- 两个值：上下 左右
除了四个值之外，还可以写border-xx-width，xx可以写top、right、bottom、left
边框的颜色：border-color
同样可以使用四个值
边框的样式：border-style
solid:表示实线dotted：表示点状虚线dashed：线状虚线double：双线
同时也可以只用四个值
border简写属性：
border：width color style，且没有顺序要求
border-top:width color style
......
