文章预览
作者:——窗边的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) 重排是指浏览器重新计算页面元素的尺寸和布局的过程。当页面的 布局属性发生变化 时,浏览器需要 重新计算 并 重新排列 元素,这个过程称为重排。重排可能会引起页面的重新渲染,因为它影响元素的几何属性。 引起重排的
………………………………