CSS重绘与回流/重排

CSS重绘与回流/重排

任何对渲染树的修改都有可能会导致下面两种操作：

1、回流

渲染树的一部分必须要更新且节点的尺寸发生了变化，会触发回流操作。每个页面至少在初始化的时候会有一次回流操作。

2、重绘

部分节点需要更新，但没有改变其形状，会触发重绘操作。

会触发重绘或回流/重排的操作

1、添加、删除元素(回流+重绘)

2、移动元素，如改变top、left或移动元素到另外1个父元素中(重绘+回流)

3、隐藏元素，display:none(回流+重绘)，visibility:hidden(只重绘，不回流)

4、改变浏览器大小(回流+重绘)

5、改变浏览器的字体大小(回流+重绘)

6、改变元素的padding、border、margin(回流+重绘)

7、改变浏览器的字体颜色（只重绘，不回流）