body
margin:10px; // 重置 margin:0; (浏览器不同间距可能不相同)
h1-h6 标题
margin:(不同); // 重置 margin:0;
font-size:(不同);
font-weight:bold; // 重置 font-weight:normal;
a
text-decoration:underline; // 重置 text-decoration: none;
color:#00E; //重置 color:#f60; (根据需要修改颜色)
b
font-weight:bold; // 重置 font-weight:normal;
i
font-style:italic; // 重置 font-style:normal;
button
background-color:#F0F0F0; // 根据需要修改颜色
border:3px outset; // 重置 border:none;
dd
margin:0 0 0 40px; // 重置 margin:0;
dl
margin:1em 0; // 重置 margin:0;
ol
padding:0 0 0 30pt; // 重置 padding:0;
li
list-style-type: disc; // 重置 list-style: none;
em
font-style:italic; // 重置 font-style:normal;
del
text-decoration:line-through; // 重置 text-decoration: none;
input
border:2px inset; // 重置 border:none;
以上列了一些常用的标签浏览器默认样式,浏览器不同,标签样式也会不同,所以需要重置浏览器样式,使页面在不同浏览器下都能有相同的效果。下面贴一下平时用的页面重置样式。
注意:重置样式需要写在样式文件的最上面,当通过公共样式文件引用时,也需要第一个引用它,然后再引其它样式
@charset "UTF-8";
html {
min-height: 100%;
font-family: "Microsoft YaHei", sans-serif; }
address, caption, cite, code, dfn, em, th, var {
font-style: normal; }
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, input, button, textarea, p, blockquote, th, td, address {
padding: 0;
margin: 0;
border: 0;
appearance: none;
-webkit-appearance: none;
-ms-appearance: none;
-moz-appearance: none;
-o-appearance: none; }
img, input, select {
border: 0;
vertical-align: middle; }
ul, ol {
list-style: none outside none; }
a, div, select {
-webkit-tap-highlight-color: transparent; }
.clearfix:before, .clearfix:after {
display: table;
content: ""; }
.clearfix:after {
clear: both; }
::-webkit-inner-spin-button {
-webkit-appearance: none; }
a, a:link, a:visited, a:focus {
text-decoration: none; }