收集的各种css reset方法总有一款是适合你的

来源:互联网 发布:海关淘宝临时工 编辑:程序博客网 时间:2024/04/28 00:26

收集的各种css reset方法总有一款是适合你的

一.最简化的CSS Reset(重设) :

* {      padding: 0;      margin: 0;}

  这是最普遍最简单的CSS重设,将所有元素的padding和margin值都设为0,可以避免一些浏览器在理解这两个属性默认值上的”分歧”。

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

  这是在上一个重设的基础上添加了对border属性的重设,初始值为0的确能避免一些问题。

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

  在前两个的基础上添加了outline属性的重设,防止一些冲突。

二.浓缩实用型CSS Reset(重设):

* {       vertical-align: baseline;       font-weight: inherit;        font-family: inherit;        font-style: inherit;       font-size: 100%;       outline: 0;       padding: 0;       margin: 0;       border: 0;}

  该CSS重设方法出自Perishable Press,这是他常用的方法。

三.Poor Man 的CSS Reset:

html, body {        padding: 0;        margin: 0; }html {       font-size:1em;} body {       font-size:100%;} a img, :link img, :visited img {       border:0px;} 

  这个重设方法将html和body下元素的padding和margin都设为0,并分别为html标签和body标签下的所有元素设置了初始的字体大小,最重要的是把有链接的图片的默认边框去掉了。

四.Siolon’s Global Reset

* {     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; }

五.Shaun Inman’s Global Reset

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

六.Yahoo(YUI) CSS Reset:

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; }

七.Eric Meyer’s CSS Reset

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: “” “”; }

八.Condensed Meyer Reset:

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;}    fieldset, img {     border: 0;}table {    border-collapse: collapse;    border-spacing: 0;}ol, ul {    list-style: none;}address, caption, cite, code, dfn, em, strong, th, var {    font-weight: normal;    font-style: normal;}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;}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {     margin: 0;     padding: 0;     border: 0;     outline: 0;     font-weight: inherit;     font-style: inherit;     font-size: 100%;     font-family: inherit;     vertical-align: baseline; } :focus {    outline: 0;} a, a:link, a:visited, a:hover, a:active{    text-decoration:none} table {    border-collapse: separate;    border-spacing: 0;} th, td {    text-align: left;    font-weight: normal;} img, iframe {    border: none;    text-decoration:none;} ol, ul {    list-style: none;} input, textarea, select, button {    font-size: 100%;    font-family: inherit;} select {    margin: inherit;} hr {    margin: 0;    padding: 0;    border: 0;    color: #000;    background-color: #000;    height: 1px}

十.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 Celik Reset CSS

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

十二.Christian Montoya Reset CSS

html, body, form, fieldset {     margin: 0;     padding: 0;     font: 100%/120% Verdana, Arial, Helvetica, sans-serif; } h1, h2, h3, h4, h5, h6, p, pre, blockquote, ul, ol, dl, address {     margin: 1em 0;     padding: 0; } li, dd, blockquote {     margin-left: 1em; } form label {     cursor: pointer; } fieldset {     border: none; } input, select, textarea {     font-size: 100%;     font-family: inherit; }

十三.Rudeworks Reset CSS

* {     margin: 0;     padding: 0;     border: none; } html {     font: 62.5% “Lucida Grande”, Lucida, Verdana, sans-serif;     text-shadow: #000 0px 0px 0px; } ul {     list-style: none;     list-style-type: none; } h1, h2, h3, h4, h5, h6, p, pre, blockquote, ul, ol, dl, address {     font-weight: normal;     margin: 0 0 1em 0; } cite, em, dfn {     font-style: italic; } sup {     position: relative;     bottom: 0.3em;     vertical-align: baseline; } sub {     position: relative;     bottom: -0.2em;     vertical-align: baseline; } li, dd, blockquote {     margin-left: 1em; } code, kbd, samp, pre, tt, var, input[type=’text’], textarea {     font-size: 100%;     font-family: monaco, “Lucida Console”, courier, mono-space; } del {     text-decoration: line-through; } ins, dfn {     border-bottom: 1px solid #ccc; } small, sup, sub {     font-size: 85%; } abbr, acronym {     text-transform: uppercase;     font-size: 85%;     letter-spacing: .1em;     border-bottom-style: dotted;     border-bottom-width: 1px; } a abbr, a acronym {     border: none; } sup {     vertical-align: super; } sub {     vertical-align: sub; } h1 {     font-size: 2em; } h2 {     font-size: 1.8em; } h3 {     font-size: 1.6em; } h4 {     font-size: 1.4em; } h5 {     font-size: 1.2em; } h6 {     font-size: 1em; } a, a:link, a:visited, a:hover, a:active {     outline: 0;     text-decoration: none; } a img {     border: none;     text-decoration: none; } img {     border: none;     text-decoration: none; } label, button {     cursor: pointer; } input:focus, select:focus, textarea:focus {     background-color: #FFF; } fieldset {     border: none; } .clear {     clear: both; } .float-left {     float: left; } .float-right {     float: right; } body {     text-align: center; } #wrapper {     margin: 0 auto;     text-align: left; }

十四. Anieto2K Reset CSS

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

十五.CSSLab CSS Reset

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {     margin: 0;     padding: 0;     border: 0;     outline: 0;     font-weight: inherit;     font-style: inherit;     font-size: 100%;     font-family: inherit;     vertical-align: baseline; } :focus {     outline: 0; } table {     border-collapse: separate;     border-spacing: 0; } caption, th, td {     text-align: left;     font-weight: normal; } a img, iframe {     border: none; } ol, ul {     list-style: none; } input, textarea, select, button {     font-size: 100%;     font-family: inherit; } select {     margin: inherit; } /* Fixes incorrect placement of numbers in ol’s in IE6/7 */ ol { margin-left:2em; } /* == clearfix == */ .clearfix:after {     content: “.”;     display: block;     height: 0;     clear: both;     visibility: hidden; } .clearfix {display: inline-block;} * html .clearfix {height: 1%;} .clearfix {display: block;}
0 0