CSS 书写规范与reset

@charset "utf-8";
/* -----------------------------------------------------------------------
   * BYR Common CSS
   * Copyright (c) 2014
   * Contact Us zhumh77@qq.com
----------------------------------------------------------------------- */
/* reset.css */
* { padding:0; margin:0;}html {margin:0;padding:0;border:0;}body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, article, aside, dialog, figure, footer, header, hgroup, nav, section {margin:0;padding:0;border:0; font:inherit;vertical-align:baseline;}article, aside, details, figcaption, figure, dialog, footer, header, hgroup, menu, nav, section {display:block;}table {border-collapse:separate;border-spacing:0;}caption, th, td {font-weight:normal;float:none !important;}table, th, td {vertical-align:middle;}blockquote:before, blockquote:after, q:before, q:after {content:‘‘;}blockquote, q {quotes:"" "";}img,a img{border:none;}:focus {outline:0;}input,button,select,textarea{outline:none;}textarea{resize:none;}input,select { border:0;}
body {font-family:"微软雅黑","宋体",Arial, sans-serif; font-size:13px; color:#333;}
body, html {width:100%; height:100%; min-width:768px; min-height:550px;}
/* typography.css */
pre {white-space: pre-wrap; /* css-3 */white-space: -moz-pre-wrap; /* Mozilla, since 1999 */white-space: -pre-wrap; /* Opera 4-6 */white-space: -o-pre-wrap; /* Opera 7 */    word-wrap: break-word; /* Internet Explorer 5.5+ */}input.dialog{height:0; height:0; font-size:0; line-height:0; border:none;}h1,h2,h3,h4,h5,h6{font-size:100%;}h1{font-size:34px;}h2{font-size:26px;}h3{font-size:18px;}h4{font-size:16px;}h5{font-size:14px;}h6{font-size:12px;}input,label,img,th,select{vertical-align:middle;}.font-fixh{font-family: Georgia,Arial; color: #f00; font-size: 16px; font-weight: 700;}address,cite,dfn,em,var{font-style:normal;}code,kbd,pre,samp{font-family:courier new,courier,monospace;}input.button ,input.btn{padding:0.25em;width: auto;_width:0;overflow:visible !ie;}button { cursor:pointer;}blockquote {margin:1.5em;color:#666;font-style:italic;} .vem {vertical-align:middle;} .vet {vertical-align:top;}
ul ,li{list-style-type:none;}
/* font */
.f12,.f12 a{font-size:12px;}.f14,.f14 a{font-size:14px;}.f16,.f16 a{font-size:16px;}.f18,.f18 a{font-size:18px;}.f20,.f20 a{font-size:20px;}
.lh20{line-height: 20px;}.lh22{line-height: 22px;}.lh24{line-height: 24px;}.lh25{line-height: 25px;}.lh26{line-height: 26px;}.lh28{line-height: 28px;}.lh30{line-height: 30px;}.lh35{line-height: 35px;}.lh40{line-height: 40px;}.lh50{line-height: 50px;}.lh60{line-height: 60px;}.h20 { height:20px;}.h24 { height:24px;}.h25 { height:25px;}.h28 { height:28px;}.h30 { height:30px;}.h35 { height:35px;}.h40 { height:40px;}.h50 { height:50px;}.h60 { height:60px;}.h100 { height:100px;}
.fb{ font-weight:bold;}.fn{ font-weight:normal;}
.bk,.bk3,.bk5,.bk6,.bk8,.bk10,.bk15,.bk20,.bk30{clear: both;font-size: 1px;height: 0;line-height: 1px;}.bk3{height: 3px;}.bk5{height: 5px;}.bk6{height: 6px;}.bk8{height: 8px;}.bk10{height:10px;}.bk15{height: 15px;}.bk20{height: 20px;}.bk30{height: 30px;}
.clear:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.lf { float:left;}.rt { float:right;}.ovau { overflow:auto;}.ovhi { overflow:hidden;}.psAb {position:absolute;}.psRe {position:relative;}.disbl { display:block;}.disin { display:inline-block;}.disno {display:none;}.tdu,.tdu a { text-decoration:underline;}.tdn,.tdn a { text-decoration:none;}.textl { text-align:left;}.textc { text-align:center;}.textr { text-align:right;}.mar0a { margin:0 auto;} .cupo {cursor:pointer;}
/*网格化*/
.grd1 { width:40px;}.grd2 { width:80px;}.grd3 { width:120px;}.grd4 { width:160px;}.grd5 { width:200px;}.grd6 { width:240px;}.grd7 { width:280px;}.grd8 { width:320px;}.grd9 { width:360px;}.grd10 { width:400px;}.grd11 { width:440px;}.grd12 { width:480px;}.grd13 { width:520px;}.grd14 { width:560px;}.grd15 { width:600px;}.grd16 { width:640px;}.grd17 { width:680px;}.grd18 { width:720px;}.grd19 { width:760px;}.grd20 { width:800px;}.grd21 { width:840px;}.grd22 { width:880px;}.grd23 { width:920px;}.grd24 { width:960px;}.grd25 { width:1000px;}
@media screen and (max-width:1679px) {
.span1 {width:103px;}.span2 {width:206px;}.span3 {width:309px;}.span4 {width:412px;}.span5 {width:515px;}.span6 {width:618px;}.span7 {width:721px;}.span8 {width:824px;}.span9 {width:927px;}.span10 {width:1030px;}.span11 {width:1133px;}.span12 {width:1236px;}
}
@media screen and (min-width:1679px) {
.span1 {width:124px;}.span2 {width:248px;}.span3 {width:372px;}.span4 {width:496px;}.span5 {width:620px;}.span6 {width:744px;}.span7 {width:868px;}.span8 {width:992px;}.span9 {width:1116px;}.span10 {width:1240px;}.span11 {width:1364px;}.span12 {width:1488px;}
}

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

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