有时候需要写几个简单的活动页面,但是浏览器的默认样式并不是我们想要的,各个浏览器的样式还都不一样;这时候就需要对样式进行重置,写一些公共的样式,来兼容各个浏览器的默认样式了。以下是一些参考:
@charset 'utf-8';
html{color:#333;background:#eee;font-family:Arial,'Microsoft Yahei';}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td,strong{padding:0;margin:0;font-family:Arial,'Microsoft Yahei';}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
a{text-decoration:none; color:#33c; outline:none;}
var,em,strong{font-style:normal;}
address,caption,cite,code,dfn,em,strong,th,var, optgroup{font-style:inherit;font-weight:inherit;}
del,ins{text-decoration:none;}
li{list-style:none;}
caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}
abbr,acronym{border:0;font-variant:normal;}
sup{vertical-align:baseline;}
sub{vertical-align:baseline;}
legend{color:#333;}
input,button,textarea,select,optgroup,option{font-family:inherit; font-size:inherit;font-style:inherit;font-weight:inherit;}
input,button,textarea,select{*font-size:100%;}
body{-webkit-user-select:none;-webkit-text-size-adjust:none;-webkit-transform-style:preserve-3d;}
*{-webkit-tap-highlight-color:rgba(0,0,0,0);}
.clearfix:after {content:"\200B"; display:block; height:0; clear:both; }
.clearfix { *zoom:1; }
.text-in {
text-indent: 2em;
}
.text-center {
text-align: center;
}
.text-right {
text-align: right;
}
.cl-red {
color: #e02525;
}
.cl-yellow {
color: #ffec51;
}
.cl-white {
color: #fef4de;
}
.cl-coffee {
color: #a7660c;
}
.cl-blue {
color: #06aaff;
}
.bg-white {
background: #fff;
}