h1(选择器){ color（属性）:white（属性值）; font-size:14px;（声明） }
在页面中使用CSS 1.外链 使用“link” 2.嵌入 在style中进行设置 3.内联（不建议使用，设置后无法使用以上两种进行样式的修改） 在body标签中进行样式的设置
选择器 1.通配选择器：*{} 2.标签选择器 3.id选择器：#+id 4.类选择器 5.属性选择器：[属性名]{} 属性选择器中可以有属性值， - ^="#" 指选中以#开头的属性值 - $=".jpg" 指选中以.jpg结尾的属性值
伪类 1.状态伪类（这里以a链接举例） - link 链接默认状态 - visited 链接访问之后的样式 - hover 鼠标移入的样式 - active 鼠标点击后链接的样式 - focus （以文本框为例） 在鼠标点击文本框后，框的样式可以进行改变 2.结构伪类：nth-child（）；
组合 1.直接组合 AB 满足A同时满足B 2.后代组合 A B 选中B，如果它是A的子孙 3.亲子组合 A>B 选中B，如果它是A的子元素 4.兄弟选择器 A~B 选中B，如果它在A后且和A同级 5.相邻选择器 A+B 选中B，如果它紧跟在A后面
颜色
1.rgb
2.HSL
Hue 色相，范围是0360（环状）
Saturation 饱和度，越高越鲜艳，0100%
Lightness 指颜色明亮程度，颜色越高越亮，范围是0100%
3.直接输入关键字，即颜色的英文，如：red、yellow
4.rgba alpha 透明度 01
字体 - Serif 衬线体：Georgia、宋体 - Sans-Serif 无衬线体：Arial、Helvetica、黑体、微软雅黑 - CUrsive 手写体：Caflisch Script、楷体 - Fantasy 夸张风格：Comic Sans MS、Papyrus - Monospace 等宽字体：Consolas、Courier、中文字体 font：style weight size/height family
text-align 1.left 2.center 3.right 4.justify 分散对齐，即两端对齐（只有在非最后一行中才可以应用）
text-decoration 1.none 2.underkine 3.line-through 4.overline 上划线
white-space 空格样式 1.normal 默认，只保留一个空格 2.nowrap 空格合并 3.pre 保留空格和换行 4.pre-wrap 一行能显示，不换行 5.pre-line 保留换行
继承 某些属性会自动继承其父元素的计算值（子元素并非继承2em，而是计算之后的值），除非指定另外的值 显示继承 box-sizing：inherit； 初始值 可以使用initial设置初始值
布局相关技术 1.常规流（文档流） - 行级 行级排版上下文 IFC（Inline Formatting Context）内的排版规则 - 盒子在一行内水平摆放 - 一行放不下时，换行显示 - text-align决定一行内盒子的水平对齐 - vertical-align决定一个盒子在行内的垂直对齐 - 避开浮动元素 - 块级 块级排版上下文 某些容器会创建一个BFC（Block Formatting Context） - 根元素 - 浮动、绝对定位、inline-block - Flex子项和Gird子项 - overflow值不是visible的块盒 - display：flow-root BFC内的排版规则 - 盒子从上到下摆放 - 垂直margin合并 - BFC内盒子的margin不会与外面的合并 - BFC不会和浮动元素重叠 - 表格布局
- FlexBox
- 一种新的排版上下文
- 它可以控制子级盒子
- 摆放的流向
- 摆放顺序
- 盒子宽度和高度
- 水平和垂直方向的对齐
- 是否允许折行
- Flexibility
- 可以设置子项的弹性：当容器有剩余空间时，会伸展；容器空间不够时，会收缩
- flex-groe 有剩余空间时的伸展能力
- flex-shrink 容器空间不足时收缩的能力
- flex-basis 没有伸展或收缩时的基础长度
- Grid布局
2.浮动 overflow 溢出 1.visible 默认值，内容溢出 2.hidden 隐藏溢出部分 3.scroll 溢出部分产生滚动条 4.auto 自动
块级元素 生成块级盒子 body、article、div、main、section、h1~h6、p、ul、li等 display：block 行级元素 - 生成行级盒子 - 内容分散在多个行盒 span、em、strong、cite、code等
display：inline
display属性 block 块级盒子 inline 行级盒子 inline-block 本身是行级，可以放在盒中；可以设置宽高；作为一个整体不会被拆散为多行 none
