首页 > Web开发 > 详细

谈谈CSS性能

时间:2017-11-09 00:40:18      阅读:277      评论:0      收藏:0      [点我收藏+]

CSS性能优化

1、衡量属性和布局的消耗代价;

2、探索W3C的性能优化新规范;

3、用测试数据判断优化策略。

 

慎重选择高消耗的样式

1、box-shadows;

2、border-radius;

3、transparency;

4、transforms;

5、CSS fitters(性能杀手)。

 

避免过分重排(Reflow  浏览器重新计算布局位置与大小)

常见的重排元素:

width height padding margin
display border-width border top
position font-size float text-align
overflow-y font-weight overflow left
font-family line-height vertical-align right
clear white-space bottom min-height

 

避免过分重绘(Repaints)

常见的重绘元素:

color border-style visibility background
text-decoration background-image background-position background-repeat
outline-color outline outline-style border-radius
outline-width box-shadow background-size  

 

谈谈CSS性能

原文:http://www.cnblogs.com/fengxiongZz/p/7807006.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!