1.层叠(Cascading)、优先级
1.样式表来源
2.层叠优先级
！imortant>内联>id>class=伪类选择器
3.源码位置 相同优先级，按顺序决定。
1.选择器尽量少用id 2.尽量不要使用！important 3.自己的样式加载在引用库的后面。
1.继承
大部分具有继承特性的属性跟文本相关： color 、 font 、 font-family 、 font-size 、 font-weight 、 font-variant 、 font style 、 line-height 、 letter-spacing 、 text-align 、 text-indent 、 text transform 、 white-space 以及 word-spacing 还有少部分列表、表格的属性
css的值和单位
盒模型
1.实现三角形 利用左右的border的颜色变为transparent，并且没有上边框。达成效果。
2.固定比例矩形
使用百分比继承父元素的高度和宽度。来实现固定比例。
3.实现水平居中 margin:0 auto; 4.渐变
盒模型-负外边距（只有margin可以设置为负值）
2.布局
1.常规流布局
内联、块级元素。 还有一个内敛块元素。
1.块级格式化上下文（BFC）： 如外边距塌问题解决 2.内联格式化上下文：
vertic-align决定位置
实际使用场景： 1.单行文字居中
2.文字和icon居中对齐 如果不是完全对齐，试试把父元素的font-size设置为0
2.弹性盒子布局（flex）- 一维布局
3.网格布局（grid）-二维布局
父元素书写：
grid-template-columns:1 用于设置每列占的大小
repeat(2,1fr)相当于 1fr 1fr
grid-template-rows:2 用于设置行占的大小
column-gap 列间距
row-gap 行间距
gap两者同时设置。
合并单元格，子元素书写
grid-column:span 2;合并两个网格
grid-row:span 2；合并两行
grid-area: span 3 （行合并） / span 2（列合并）
4.定位position
1.relative 2.absolute 3.fixed 4.sticky
关于sticky定位的网址：
position属性sticky详解-Css-前端这点事 (ltonus.com)
3.层叠上下文
形成层叠上下文的条件： 1.position：relative或absolute；且z-index不是auto 2.posiiton：fixed或sticky 3.flex或grid的子元素；并且z-index不是auto 4.opacity的值小于1 5.transform的值不为none 6.will-change的值不为通用值 等等
层叠顺序
编写z-index的建议 使用变量来管理z-index的值。比如：
4.变形、过渡、动画
1.变形
- 2d变形
2.3d变形
