首页 > 代码库 > CSS性能优化新属性:will-change
CSS性能优化新属性:will-change
---恢复内容开始---
will-change
属性通过告诉浏览器什么属性、什么元素将会发生变化,可以对这些操作进行可能性的优化,由此提高CSS动画的执行效率。
这个属性可以有4个值:
auto
: 实行标准浏览器优化。scroll-position
: 指明元素的滚动位置将会出现动画变化,浏览器应该为滚动视窗内容的不可见部分事先做好准备。contents
: 指明元素的内容将会发生变化,浏览器不要缓存它们的内容。<custom-ident>
: 指明will-change
实施的目标属性,比如transform
或opacity
。
如果想通知浏览器会发生一个transform
方面的变化,可以这样写:
.element {
will-change: transform;
}
我们还可以指定多个值,用逗号分隔,例如:
.element {
will-change: transform, opacity;
}
然而,千万不要过度使用will-change
属性,否则,事与愿违,页面的执行效率会降低,推荐的做法是当一个元素或属性发生变化时打开will-change
,变化完成之后关闭它。
转载自CSDN--
我跟大家一样涨知识了
---恢复内容结束---
CSS性能优化新属性:will-change
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。