base.css

@charset "utf-8";

/*!

* @名称：base.css

* @功能：1、重设浏览器默认样式

*      2、设置通用原子类

*/

/* 防止用户自定义背景颜色对网页的影响，添加让用户可以自定义字体 */

html {

background:white;

color:black;

}

/* 内外边距通常让各个浏览器样式的表现位置不同 */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {

margin:0;

padding:0;

}

/* 要注意表单元素并不继承父级 font 的问题 */

body,button,input,select,textarea {

font:12px '\5b8b\4f53',arial,sans-serif;

}

input,select,textarea {

font-size:100%;

}

/* 去掉 table cell 的边距并让其边重合 */

table {

border-collapse:collapse;

border-spacing:0;

}

/* ie bug：th 不继承 text-align */

th {

text-align:inherit;

}

/* 去除默认边框 */

fieldset,img {

border:none;

}

/* ie6 7 8(q) bug 显示为行内表现 */

iframe {

display:block;

}

/* 去掉列表前的标识，li 会继承 */

ol,ul {

list-style:none;

}

/* 对齐是排版最重要的因素，别让什么都居中 */

caption,th {

text-align:left;

}

/* 来自yahoo，让标题都自定义，适应多个系统应用 */

h1,h2,h3,h4,h5,h6 {

font-size:100%;

font-weight:500;

}

/* 统一上标和下标 */

sub,sup {

font-size:75%;

line-height:0;

position:relative;

vertical-align:baseline;

}

sup {

top:-0.5em;

}

sub {

bottom:-0.25em;

}

/* 让链接在 hover 状态下显示下划线 */

a:hover {

text-decoration:underline;

}

/* 默认不显示下划线，保持页面简洁 */

ins,a {

text-decoration:none;

}

/* 去除 ie6 & ie7 焦点点状线 */

a:focus,*:focus {

outline:none;

}

/* 清除浮动 */

.clearfix:before,.clearfix:after {

content:"";

display:table;

}

.clearfix:after {

clear:both;

overflow:hidden;

}

.clearfix {

zoom:1; /* for ie6 & ie7 */

}

.clear {

clear:both;

display:block;

font-size:0;

height:0;

line-height:0;

overflow:hidden;

}

/* 设置显示和隐藏，通常用来与 js 配合 */

.hide {

display:none;

}

.block {

display:block;

}

/* 设置浮动，减少浮动带来的 bug */

.fl,.fr {

display:inline;

}

.fl {

float:left;

}

.fr {

float:right;

}

/*文字排版、颜色*/

.f12{font-size:12px}

.f13{font-size:13px}

.f14{font-size:14px}

.f16{font-size:16px}

.f20{font-size:20px}

.fb{font-weight:bold}

.fn{font-weight:normal}

.t2{text-indent:2em}

.red,a.red{color:#cc0031}

.darkblue,a.darkblue{color:#039}

.gray,a.gray{color:#878787}

.lh150{line-height:150%}

.lh180{line-height:180%}

.lh200{line-height:200%}

.unl{text-decoration:underline;}

.no_unl{text-decoration:none;}

/*定位*/

.tl{text-align:left}

.tc{text-align:center}

.tr{text-align:right}

.fl{float:left;display:inline}

.fr{float:right;display:inline}

.cb{clear:both}

.cl{clear:left}

.cr{clear:right}

.vm{vertical-align:middle}

.pr{position:relative}

.pa{position:absolute}

.abs-right{position:absolute;right:0}

.zoom{zoom:1}

.hidden{visibility:hidden}

.none{display:none}

/*长度高度*/

.w10{width:10px}

.w20{width:20px}

.w50{width:50px}

.w90{width:90px}

.w100{width:100px}

.w200{width:200px}

.w250{width:250px}

.w500{width:500px}

.w800{width:800px}

.w{width:100%}

.h50{height:50px}

.h80{height:80px}

.h100{height:100px}

.h200{height:200px}

.h{height:100%}

/*边距*/

.m10{margin:10px}

.m15{margin:15px}

.m30{margin:30px}

.mt5{margin-top:5px}

.mt10{margin-top:10px}

.mt15{margin-top:15px}

.mt50{margin-top:50px}

.mt100{margin-top:100px}

.mb5{margin-bottom:5px}

.mb10{margin-bottom:10px}

.mb15{margin-bottom:15px}

.mb100{margin-bottom:100px}

.ml5{margin-left:5px}

.ml10{margin-left:10px}

.ml15{margin-left:15px}

.ml20{margin-left:20px}

.ml30{margin-left:30px}

.ml50{margin-left:50px}

.ml100{margin-left:100px}

.mr5{margin-right:5px}

.mr10{margin-right:10px}

.mr15{margin-right:15px}

.mr50{margin-right:50px}

.mr100{margin-right:100px}

.p10{padding:10px;}

.p15{padding:15px;}

.p30{padding:30px;}

.pt5{padding-top:5px}

.pt10{padding-top:10px}

.pt15{padding-top:15px}

.pt20{padding-top:20px}

.pt30{padding-top:30px}

.pt50{padding-top:50px}

.pb5{padding-bottom:5px}

.pb100{padding-bottom:100px}

.pl5{padding-left:5px}

.pl10{padding-left:10px}

.pl50{padding-left:50px}

.pl100{padding-left:100px}

.pr5{padding-right:5px}

.pr10{padding-right:10px}

.pr15{padding-right:15px}

.pr100{padding-right:100px}