关于CSS reset的理解

2017-09-11  本文已影响0人  宁骥

css reset顾名思义是样式重置,因为很多元素都有起始样式,不同浏览器的相同元素的起始样式可能也不一样,像*{margin:0,padding:0}就是一个样式重置,把原始样式清空统一,再写需要的样式。等于就是起始设置默认统一样式。

可以看下淘宝的(www.taobao.com):

html {

overflow-x:auto;

overflow-y:scroll;

}

body, dl, dt, dd, ul, ol, li, pre, form, fieldset, input, p, blockquote, th, td {

font-weight:400;

margin:0;

padding:0;

}

h1, h2, h3, h4, h4, h5 {

margin:0;

padding:0;

}

body {

background-color:#FFFFFF;

color:#666666;

font-family:Helvetica,Arial,sans-serif;

font-size:12px;

padding:0 10px;

text-align:left;

}

select {

font-size:12px;

}

table {

border-collapse:collapse;

}

fieldset, img {

border:0 none;

}

fieldset {

margin:0;

padding:0;

}

fieldset p {

margin:0;

padding:0 0 0 8px;

}

legend {

display:none;

}

address, caption, em, strong, th, i {

font-style:normal;

font-weight:400;

}

table caption {

margin-left:-1px;

}

hr {

border-bottom:1px solid #FFFFFF;

border-top:1px solid #E4E4E4;

border-width:1px 0;

clear:both;

height:2px;

margin:5px 0;

overflow:hidden;

}

ol, ul {

list-style-image:none;

list-style-position:outside;

list-style-type:none;

}

caption, th {

text-align:left;

}

q:before, q:after, blockquote:before, blockquote:after {

content:””;

} 就相当于设置了统一样式

最后推荐使用YUI来做reset

上一篇 下一篇

猜你喜欢

热点阅读