css什么时候造成重绘和回流
回流与重绘 1. 当render tree中的一部分(或全部)因为元素的规模尺寸，布局，隐藏等改变而需要重新构建。这就称为回流(其实我觉得叫重新布局更简单明了些)。每个页面至少需要一次回流，就是在页面第一次加载的时候。
2. 当render tree中的一些元素需要更新属性，而这些属性只是影响元素的外观，风格，而不会影响布局的，比如background-color。则就叫称为重绘。 注：从上面可以看出，回流必将引起重绘，而重绘不一定会引起回流。
任何对render tree中元素的操作都会引起回流或者重绘，比如 1. 添加、删除元素(回流+重绘) 2. 隐藏元素，display:none(回流+重绘)，visibility:hidden(只重绘，不回流) 3. 移动元素，比如改变top,left(jquery的animate方法就是,改变top,left不一定会影响回流)，或者移动元素到另外1个父元素中。(重绘+回流) 4. 对style的操作(对不同的属性操作，影响不一样) 5. 还有一种是用户的操作，比如改变浏览器大小，改变浏览器的字体大小等(回流+重绘)
关于这个问题，CSS会在以下情况下引起重绘和回流：
1. 当添加、删除、修改DOM节点时，会导致回流和重绘。因为这些操作可能会改变页面的布局和样式。
2. 当修改DOM元素的样式时，会引起重绘。例如修改元素的颜色、背景色、边框等。
3. 当浏览器窗口大小发生改变时，会触发回流和重绘。因为页面的布局会随着窗口大小的变化而改变。
4. 当获取某些属性值时，会引起回流。例如offsetWidth、offsetHeight、scrollTop等。
5. 当修改元素的位置属性（top、left、right、bottom）时，会触发回流。
6. 当修改元素的尺寸属性（width、height）时，会引起回流和重绘。
7. 当修改元素的文本内容时，会触发回流和重绘。因为文本的内容改变可能会导致元素的尺寸变化。
需要注意的是，回流比重绘代价更高，会更消耗性能。因此，应该尽量避免频繁地触发回流和重绘，可以通过合并多次修改、使用CSS动画代替JavaScript动画等方式来优化性能。