CSS 函数 calc() 会引起重排重绘吗

文章预览

点击上方  前端Q ，关注公众号 回复 加群 ，加入前端Q技术交流群 本文转载于稀土掘金技术社区，作者——窗边的anini 原文链接：https://juejin.cn/post/7374716539679359003 calc() 用法介绍 CSS 中的 calc() 函数可以执行元素属性的计算。 首先简单介绍一下 CSS 中的 calc() 函数的用法。 语法： property :  calc ( expression ); 这里的 expression 可以包含加号 ( + )、减号 ( - )、乘号 ( * )、除号 ( / )，以及可以进行数学运算的数字和长度单位。 使用示例： 组合长度单位 ： .element  {    width :  calc ( 100vh  -  20px ); } 嵌套使用 ： .element  {    margin :  calc ( 60px  + calc( 10%  *  2 )); } 初步分析 calc() 是否引起重排重绘 首先介绍一下重排重绘： 重排（Reflow） 重排是指浏览器重新计算页面元素的尺寸和布局的过程。当页面的 布局属性发生变化 时，浏览器需要 重新计算 并 重新 ………………………………