每一个浏览器都有默认的样式,但每一个浏览的默认样式都有一些轻微的差别。为了让我们的网站在各个浏览器上显示得一样,我们需对各浏览器之间有差异的样式、不需要的默认样式进行标准化。于是有了reset.css——重置样式表。
清单一:简易重置样式表
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p, blockquote,th,td { margin:0; padding:0; } table { border-collapse:collapse; border-spacing:0; } fieldset,img { border:0; } address,caption,cite,code,dfn,em,strong,th,var { font-style:normal; font-weight:normal; } ol,ul { margin:1em 0; margin-left:40px; padding-left:0; } ul { list-style-type:disc; } ol { list-style-type:decimal; } caption,th { text-align:left; } h1,h2,h3,h4,h5,h6 { font-size:100%; }
清单二:完整重置样式表
/* BLOCK ELEMENTS */ html, div, map, dt, form { display:block; } body { display:block; margin:8px; font-family:serif; font-size:medium; } p, dl { display:block; margin-top:1em; margin-bottom:1em; } dd { display:block; margin-left:40px; } address { display:block; font-style:italic; } blockquote { display:block; margin:1em 40px; } h1 { display:block; font-size:2em; font-weight:bold; margin:0.67em 0; } h2 { display:block; font-size:1.5em; font-weight:bold; margin:0.83em 0; } h3 { display:block; font-size:1.125em; font-weight:bold; margin:1em 0; } h4 { display:block; font-size:1em; font-weight:bold; margin:1.33em 0; } h5 { display:block; font-size:0.75em; font-weight:bold; margin:1.67em 0; } h6 { display:block; font-size:0.5625em; font-weight:bold; margin:2.33em 0; } pre{ display:block; font-family:monospace; white-space:pre; margin:1em 0; } hr { display:block; height:2px; border:1px; margin:0.5em auto 0.5em auto; } /* TABLE ELEMENTS */ table { border-spacing:2px; border-collapse:separate; margin-top:0; margin-bottom:0; text-indent:0; } caption { text-align:center; } td { padding:1px; } th { font-weight:bold; padding:1px; } tbody, thead, tfoot { vertical-align:middle; } /* INLINE ELEMENTS */ strong { font-weight:bold; } cite, em, var, dfn { font-style:italic; } code, kbd, samp { font-family:monospace; } ins { text-decoration:underline; } del { text-decoration:line-through; } sub { vertical-align:-0.25em; font-size:smaller; line-height:normal; } sup { vertical-align: 0.5em; font-size:smaller; line-height:normal; } abbr[title], { border-bottom:dotted 1px; } /* LIST ELEMENTS */ ul { list-style-type:disc; margin:1em 0; margin-left:40px; padding-left:0;} ol { list-style-type:decimal; margin:1em 0; margin-left:40px; padding-left:0;} /* remove top & bottom margins for nested lists */ ul ul, ul ol, ul dl, ol ul, ol ol, ol dl, dl ul, dl ol, dl dl { margin-top:0; margin-bottom:0; } /* use circle when ul nested 2 deep */ ol ul, ul ul { list-style-type:circle; } /* use square when ul nested 3 deep */ ol ol ul, ol ul ul, ul ol ul, ul ul ul { list-style-type:square; }
在Firfox浏览器输resource://gre-resources/html.css查看Firfox浏览器的默认样式。