常用的CSS RESET

    什么是css reset?为什么要使用css reset呢?其原因很简单,因为不同的浏览器对选择器可能会有不同的默认值,如缩进的长度,padding的大小等.如果不加以处理,将会导致不同浏览器上页面表现得不一样,甚至混乱.所以需要css reset把所有的东西复位,统一一下.下面介绍几种常用的css   reset.

    首先是一种简单的方法,把全部元素的padding,margin,border置0.

* {
    padding: 0;
    margin: 0;
    border: 0;
    }

    这是最简单,最安全的方法,但也最耗资源.所以不推荐使用。

    接下来是Yahoo!的重设代码，Yahoo!的重置消除了关键HTML元素上的不一致，有选择地重设，相对前一种方法，消耗资源要小得多，也是最多人使用的方法之一。

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre, 
form,fieldset,input,textarea,p,blockquote,th,td { 
padding: 0; 
margin: 0; 
} 
table { 
border-collapse: collapse; 
border-spacing: 0; 
} 
fieldset,img { 
border: 0; 
} 
address,caption,cite,code,dfn,em,strong,th,var { 
font-weight: normal; 
font-style: normal; 
} 
ol,ul { 
list-style: none; 
} 
caption,th { 
text-align: left; 
} 
h1,h2,h3,h4,h5,h6 { 
font-weight: normal; 
font-size: 100%; 
} 
q:before,q:after { 
content:''; 
} 
abbr,acronym { border: 0; 
}

 

    下面是另外几种流行的css重设方法：

 

    Eric Meyer Reset CSS

html, body, div, span, applet, object, iframe, table, caption, 
tbody, tfoot, thead, tr, th, td, del, dfn, em, font, img, ins, 
kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, 
h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, 
acronym, address, big, cite, code, dl, dt, dd, ol, ul, li, 
fieldset, form, label, legend { 
vertical-align: baseline; 
font-family: inherit; 
font-weight: inherit; 
font-style: inherit; 
font-size: 100%; 
outline: 0; 
padding: 0; 
margin: 0; 
border: 0; 
} 
:focus { 
outline: 0; 
} 
body { 
background: white; 
line-height: 1; 
color: black; 
} 
ol, ul { 
list-style: none; 
} 
table { 
border-collapse: separate; 
border-spacing: 0; 
} 
caption, th, td { 
font-weight: normal; 
text-align: left; 
} 
blockquote:before, blockquote:after, q:before, q:after { 
content: ""; 
} 
blockquote, q { 
quotes: "" ""; 
}

 

    Chris Poteet’s Reset CSS

* { 
vertical-align: baseline; 
font-family: inherit; 
font-style: inherit; 
font-size: 100%; 
border: none; 
padding: 0; 
margin: 0; 
} 
body { 
padding: 5px; 
} 
h1, h2, h3, h4, h5, h6, p, pre, blockquote, form, ul, ol, dl { 
margin: 20px 0; 
} 
li, dd, blockquote { 
margin-left: 40px; 
} 
table { 
border-collapse: collapse; 
border-spacing: 0; 
}

 

    Tantek’s CSS Reset

:link, :visited {
    text-decoration: none;
    }
ul, ol {
    list-style: none;
    }
h1, h2, h3, h4, h5, h6, pre, code, p {
    font-size: 1em;
    }
ul, ol, dl, li, dt, dd, h1, h2, h3, h4, h5, h6, pre, 
form, body, html, p, blockquote, fieldset, input {
    padding: 0;
    margin: 0;
    }
a img, :link img, :visited img {
    border: none;
    }
address {
    font-style: normal;
    }

 

 

参考：

A Killer Collection of Global CSS Reset Styles

10 Técnicas para Reset CSS