使用normalize.css代替reset.css但在使用中浏览器会有一些默认样式,比如说
ul会有默认的内边距,dd也会有默认的内边距。自己还得手动的清除,那么和reset.css
比起来,normalize.css优势怎样体现呢?
版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。
reset.css样式重置会让各个浏览器的CSS样式保持一个基准,而这个基准就是“归零”。
但它归零的思想过于暴力,宁可错杀一千,也不放过一个要清零的元素,其实很多设置都是画蛇添足
取一段reset.css的代码
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre,
code, form, fieldset, legend, input, button, textarea, p,
blockquote, th, td {
margin: 0;
padding: 0; }
div,li标签默认是没有margin,padding值,但是还是被设置{margin:0; padding:0;}属性
dt标签的margin,padding默认值就是0,但这里又被设置了一次{margin:0; padding:0;}
code标签属于inline行内元素,是不能设置{margin:0; padding:0;}
....
我们再来看一段
address,em,strong,th,var {
font-weight: normal;
font-style: normal;}
这个设置往往在开发中有很多潜在的问题,单从用户体验上讲一个例子:
假设你的页面上有一个可编辑内容区域,用户设置了一个strong效果,但发现它却没有任何的反应,用户就会产生的疑惑,为什么我加粗了却没有反应?
或许,你都不知道它已经被暴力的清0了。
normalize.css 帮你合理重置掉可能产生问题的样式,坚持保留部分浏览器的基础样式,解决一些潜在的问题,做到真正合理的浏览器样式初始化。(想你所想,给你所要...)