分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 技术分享

谈谈CSS性能

发布时间:2023-09-06 01:23责任编辑:傅花花关键词:CSS

CSS性能优化

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

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

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

慎重选择高消耗的样式

1、box-shadows;

2、border-radius;

3、transparency;

4、transforms;

5、CSS fitters(性能杀手)。

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

常见的重排元素:

widthheightpaddingmargin
displayborder-widthbordertop
positionfont-sizefloattext-align
overflow-yfont-weightoverflowleft
font-familyline-heightvertical-alignright
clearwhite-spacebottommin-height

避免过分重绘(Repaints)

常见的重绘元素:

colorborder-stylevisibilitybackground
text-decorationbackground-imagebackground-positionbackground-repeat
outline-coloroutlineoutline-styleborder-radius
outline-widthbox-shadowbackground-size 

谈谈CSS性能

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

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved