CSS:CSS 优化和提高性能的方法有哪些(三颗星)

1.加载性能:

  1. css 压缩:将写好的 css 进行打包压缩,可以减小文件体积。
  2. css 单一样式:当需要下边距和左边距的时候,很多时候会选择使用margin:top 0 bottom 0 ; 但margin-bottom:bottom;margin-left:left;执行效率会更高。
  3. 减少使用@import,建议使用 link,因为后者在页面加载时一起加载,前者是等待页面加载完成之后再进行加载。

2.选择器性能:

  1. 关键选择器(key selector)。选择器的最后面的部分为关键选择器(即用来匹配目标元素的部分)。CSS 选择符是从右到左进行匹配的。当使用后代选择器的时候,浏览器会遍历所有子元素来确定是否是指定的元素等等;
  2. 如果规则拥有 ID 选择器作为其关键选择器,则不要为规则增加标签。过滤掉无关的规则(这样样式系统就不会浪费时间去匹配它们了)。
  3. 避免使用通配规则,如*{}计算次数惊人,只对需要用到的元素进行选择。
  4. 尽量少的去对标签进行选择,而是用 c

剩余60%内容,订阅专栏后可继续查看/也可单篇购买

前端面试题 文章被收录于专栏

前端面试的一些常问问题、问题的具体实现(可直接运行)以及底层原理

全部评论
平时优化都需要注意的
点赞 回复 分享
发布于 2023-02-11 16:08 四川
感谢大佬的分享
点赞 回复 分享
发布于 2023-02-10 20:09 重庆
这个平时在哪里会用到
点赞 回复 分享
发布于 2023-02-10 20:06 辽宁

相关推荐

算法冲刺中:kpi面加一,面完完全没动静,感谢信都没有
点赞 评论 收藏
分享
点赞 评论 收藏
分享
评论
点赞
1
分享

创作者周榜

更多
牛客网
牛客网在线编程
牛客网题解
牛客企业服务