css
- 理解CSS（层叠，样示表）
- html内容
- css表现“排版布局和装饰”
- 层叠、优先级：由层叠概念引申出CSS代码good practice
- 选择器尽量少用id(大面积使用id,不利于覆盖）
- 尽量不要用！important(灵活性压缩）
- 自己的样式加载在引用库校式的后面
- 样式表来源
- 选择器优先级
- 源码位置
- css默认继承‘与文本相关’从子到父
- 可以使用inherit关键字显示指定一个属性值从其父元素继承
- CSS值：
- 文字类：比如像initial这种关键字，颜色，位置等等
- 数值类：比如z-index：1 这种数值，或者带有单位的数值，百分比等
- 函数生成：比如cala(),min(),max()
- 长度-绝对长度：px,pt,cm,in;-相对长度：em,rem,ex,rex..wv,vh,rmin,vmax
- 角度：deg,grad,turn,rad
- 时间：s,ms
- 分辨率；dpi,dpcm,dppx
- 盒模型：padding、border、margin,只有margin可以设置负值（margin负值最终减少的是外界可以感知的宽高）
- 布局（常规流、float浮动流）
- 任意盒子类型 外部显示类型：规定了该盒子如何与同一格式上下文中的其他元素一起显示；内部显示类型：规定了该盒内部的布局方式
- 常规流中的盒子：块级盒子（块级格式化上下文）内联级盒子（内联级格式化上下文）
- 会产生外边距塌陷的情况：
- 两兄弟元素之间相邻的上下外边距
- 父子元素之间相邻的上下外边距
- 内容为空元素自己上下外边距相邻
- 在两个相邻的上下边距之间增加border、padding或者内联元素，使之不相邻
- 在父子元素重叠时，除了上述方法，还可以设置父元素为BFC，使得父子不在同级BFC中
- 叠层上下文：对html元素的三维构想，将元素沿着垂直屏幕的虚构的z轴排开
- 编写z-index的建议：
- 使用css变量或者预处理语言的变量，管理z-index的值
- 将预设间隔设置10或100，方便后续的插入
- transition:通过指定某些元素属性从一种起始状态，在一定时间内以某种变化节奏，过渡到终止状态
- timing-function一般有三种用法：线性、贝塞尔曲线、阶跃
