css reset

第一次见到reset.css文件是在我的第一个wp主题里,有style.css和reset.css,打开之后看到下面的代码:

*{margin:0;padding:0;font-family:"Segoe UI",Calibri,"Myriad Pro",Myriad,"Trebuchet MS",Helvetica,Arial,sans-serif;}

上面还有一行注释——“Reset default browser CSS”

哦,明白了,为了重置浏览器的默认样式,所以说css reset的目的在于解决浏览器在默认样式上的差异问题

但是reset.css真的有必要么?

首先看css reset有哪些问题:

1、破环了浏览器原有的合理的基本样式,比如
*{
margin:0;
padding:0;
}

导致浏览器很多基本样式没了,比如input radio这种默认是有margin的

2、css reset里出现的选择器比如* p这种选择器,是对这种样式的全局匹配,效率低

3、很多reset之后的元素,会被重新覆盖

4、多引入了一个css文件或者增加了文件大小- –

当然,好处也是显而易见的,确保了安全,相当于在一张白纸上作画,不过一旦引入了reset.css,后续要去掉就难哪

 

po主的观点

如果要追求样式的完全统一,以其reset一样,然后在global.css里定义全局样式,不如直接用global.css取代reset.css的功能。比如strong,如果希望全局都是加粗的,那就没必要reset,如果全局有其他表现强调的样式,那直接在global.css里写就好了。

其实这也就指的是normalize.css,normalize统一了元素在各个浏览器的表现,如果对UI要求比较高,根据项目定制自己的normalize.css也是极好的,很多流行的UI库就是用了normalize。

相关的一些文章

no reset css

到底该不该用 CSS reset?

Normalize.css 与传统的 CSS Reset 有哪些区别?