【前端学习 - CSS(19)CSS 优化、提高性能】

1.CSS 优化、提高性能的方法有哪些?

  • 多个 css 可合并,并尽量减少 http 请求
  • 属性值为 0 时,不加单位(margin: 0)
  • 将 css 文件放在页面最上面(CSS会阻塞渲染,在CSS文件请求、下载、解析完成之前,浏览器将不会渲染任何已处理的内容。如果放在下面,当html结构渲染完以后,解析css,又会重新渲染一次,导致页面闪动)
  • 避免后代选择符,避免链式选择符过长
  • 使用紧凑的语法(margin: 8px 6px 7px 5px; )
  • 使用语义化命名,便于维护(属于优化)
  • 尽量少的使用!impotrant,可以选择其他选择器
  • 遵守盒子模型规则

技巧:合并简写缩短链,语义遵守盒模型


 

猜你喜欢

转载自blog.csdn.net/weixin_60364883/article/details/123055250