一、 CSS 选择器的优先级
- !important 优先级最高 权重值为 1111
- 内联样式：如，style="" 权重值为 1000
- ID 选择器：如，#content 权重值为 0100
- 类、伪类和属性选择器：如，.content 权重值为 0010
- 类型选择器和伪元素选择器：如，div p 权重值为 0001
- 通配符、子选择器、相邻选择器：如，* > + 权重值为 0000
- 继承的样式没有权值
二、 伪类和伪元素的区别
- 伪类本质上是为了弥补常规 CSS 选择器的不足，伪元素本质上是创建一个有内容的虚拟容器
- CSS3 中伪类和伪元素的语法不同：伪类：
:link、:hover伪元素：::before、::after - 可以同时使用多个伪类，而只能同时使用一个伪元素
- 伪元素/伪对象：不存在 DOM 文档中，需要不能用 JS 来操作，仅仅是在 CSS 渲染层加入，并要添加
content配合 - 伪类：存在 DOM 文档中
伪类和伪元素的根本区别在于：他们是否创建了新的元素，这个新创建的元素就叫”伪元素“
三、CSS3 中定位有哪些及其区别
- absolute
四、CSS3 常见布局
五、重排重绘为什么会影响渲染，如何避免?
谈谈你对重排（reflow）和重绘（repaint）的理解
重排：无论通过什么方式影响了元素的几何信息（元素在视口内的位置和尺寸大小），浏览器需要重新计算元素在视口内的几何属性，这个过程叫重排
重绘：通过构建渲染树和重排（回流）阶段，我们知道了哪些节点是可见的，以及可见节点的样式和具体的几何信息，接下来就可以将渲染树的每个节点都转换为屏幕上的实际像素，这个过程叫重绘
- js 尽量减少对样式的操作，能用 css 完成的就用 css
- 对 dom 操作尽量少，能用 createDocumentFragment 的地方尽量用
- 如果必须要用 js 操作样式，能合并尽量合并不要分多次操作
- resize 事件 最好加上防抖，能尽量少触发就少触发
- 加载图片的时候，提前写好宽高
- 使用
absolute或fixed使元素脱离文档流 - 开启 GPU 加速：利用 CSS 属性
transform、will-change等。比如改变元素位置，我们使用 translate 会比使用绝对定位改变其 left 、top 等来的高效，因为它不会触发重排或重绘，transform 使浏览器为元素创建⼀个 GPU 图层，这使得动画元素在一个独立的层中进行渲染。当元素的内容没有发生改变，就没有必要进行重绘