1、CSS厉害之处是层叠样式表，层叠指样式层叠，选择器层叠，文件层叠，这些特性使CSS极度灵活。
2、border调试法，怀疑某个元素有问题，就给这个元素加上border。
3、资料网站推荐：Google搜索关键词加mdn, CSS tricks , 张鑫旭博客。
4、文档流：流动方向，inline元素从左到右，到达最右边才会换行，block元素从上到下，每一个都另起一行，inline-block元素也是从左到右。
宽度，inline宽度为内部inline元素的和，不能用width指定，block自动计算宽度，可用width指定，inline-block结合两者特点可用width指定。
高度，inline高度由line-height间接决定，和height无关，block高度由内部文档流元素决定的，可以设置height，inline-block和block类似，可以设置height。
5、overflow：当内容的宽度或高度大于容器时会溢出，可用他来设置是否显示滚动条，有auto，scroll，hidden，visible属性。
6、布局分为float，grid，flex三种布局，当需要兼容IE9时，用float布局，父元素添加clearfix属性，只需要兼容最新浏览器时用grid布局，其他的用flex布局。在写布局时，永远不要把width和height写死，除非特殊说明，用min-width/max-width/min-height/max-height.
7、CSS定位：背景的范围是border外边沿围成的区域，一个div的分层，从上到下分别为内联子元素（相当于文字），浮动元素，块级子元素，border，background。
8、浮动元素脱离文档流，position属性，static（默认值，呆在文档流中），relative（相对定位，升起来但不脱离文档流），absolute（绝对定位），fixed（固定定位），sticky（粘滞定位），如果写了一个absolute，一般都得补一个relative，如果写了absolute或fixed，一般都得补top和left.
9、浏览器渲染原理：下面简要概述了浏览器完成的步骤：
- 处理 HTML 标记并构建 DOM 树。
- 处理 CSS 标记并构建 CSSOM 树。
- 将 DOM 与 CSSOM 合并成一个渲染树。
- 根据渲染树来布局，以计算每个节点的几何信息。
- 将各个节点绘制到屏幕上。
三种样式更新方式：
10、transform：四个常用功能translate(位移)，scale（缩放），rotate（旋转），skew（倾斜），这四个功能一般都需要配合transition过渡，inline元素不支持transform，需要先变成block元素。
11、transition:作用，补充中间帧，语法，transition：属性名 时长 过渡方式 延迟，可以用all代表所有属性，过渡除了起始还有中间点，有两种办法代替中间点，使用两次transform或者使用animation（声明关键帧，添加动画）。
12、animation：时长/过渡方式/延迟/次数/方向/填充模式/是否暂停/动画名。
13、如何让动画停止在最后一帧，在属性中加forwards。
14、@keyframes语法：