CSS-Reset

2019-01-25  本文已影响0人  迦叶凡

什么是css-reset

所谓的css reset技术就是用来重置元素的默认样式。因为HTML标签在浏览器上是具有默认样式的,然后不同的浏览器,标签的默认样式会不尽相同。所以在开发前往往会对需要的标签的进行默认样式的处理,以求达到统一的展示效果。比如下面这一种简单粗暴的处理:

* {
  margin: 0;
  padding: 0;
}

虽然上述方法简单粗暴,但是并不推荐这么做,因为:

  1. *通配符会遍历整个DOM的标签,当网站较大时,样式比较多,这样会影响网站加载的性能。
  2. 上述写法将所有的标签的margin和padding都重置了,包括一些不需要重置的标签

总结:上面的方法总体来说会浪费资源和性能,效率比较低。

reset.css VS Normalize.css

目前比较推荐的两种css reset解决方案。关于两者的区别,可以查看知乎这篇文章的回答http://www.zhihu.com/question/20094066

本人使用的是Normalize.css,毕竟大名鼎鼎的Bootstrap也是用的这种解决方案。

最后

没有最正确的css reset方案,只有最适合自己的css reset方案。上面推荐的两种解决方案也只是覆盖了大部分情况,如果你有特殊要求,那么可以针对自己的项目重新或是在上述两种方案的基础上进行DIY。如果没有特殊要求下,用reset.css或normalize.css就可以啦。

上一篇 下一篇

猜你喜欢

热点阅读