您的位置:首页 > Web前端 > CSS

css的重置和原子类的使用

2015-12-08 14:59 447 查看
@charset "utf-8";
/* Reset Definitions*/
body, div, p, a, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, form, input, textarea, select, button, th, td { margin: 0; padding: 0; font-family: '宋体'; font-size: 12px; color: #35383e; }
a { text-decoration: none; cursor: pointer; }
img { border: 0; }
img, input, textarea, select, button { vertical-align: middle; }
table, th, td { font-size: 12px; font-family: inherit; line-height: inherit; }
td { word-break: break-all; }
textarea { word-wrap: break-word; word-break: break-all; }
ul, ol, li { list-style: none; }
dl, em, i, u, q, s, caption { font-style: normal; font-weight: normal; text-decoration: none; }

/* Global Definitions
----------------------------------------*/
.fl { float: left; _display: inline; }
.fr { float: right; _display: inline; }
.clear { clear: both; }
.clearfix { display: block; *display: inline-block; _height: 1%; }
.clearfix:after { content: '\20'; display: block; clear: both; height: 0; visibility: hidden; }

.block { display: block; }
.inline { display: inline; }
.inblock { display: inline-block; }

.hide { display: none; }
.hidden { visibility: hidden; }
.ohide { overflow: hidden; }

.mt05 { margin-top: 5px; }
.mt10 { margin-top: 10px; }
.mt15 { margin-top: 15px; }
.mt20 { margin-top: 20px; }
.mt25 { margin-top: 25px; }
.mt30 { margin-top: 30px; }
.mt35 { margin-top: 35px; }
.mt40 { margin-top: 40px; }
.mt45 { margin-top: 45px; }
.mt50 { margin-top: 50px; }
.mr05 { margin-right: 5px; }
.mr10 { margin-right: 10px; }
.mr15 { margin-right: 15px; }
.mr20 { margin-right: 20px; }
.mr25 { margin-right: 25px; }
.mr30 { margin-right: 30px; }
.mr35 { margin-right: 35px; }
.mr40 { margin-right: 40px; }
.mr45 { margin-right: 45px; }
.mr50 { margin-right: 50px; }
.mb05 { margin-bottom: 5px; }
.mb10 { margin-bottom: 10px; }
.mb15 { margin-bottom: 15px; }
.mb20 { margin-bottom: 20px; }
.mb25 { margin-bottom: 25px; }
.mb30 { margin-bottom: 30px; }
.mb35 { margin-bottom: 35px; }
.mb40 { margin-bottom: 40px; }
.mb45 { margin-bottom: 45px; }
.mb50 { margin-bottom: 50px; }
.ml05 { margin-left: 5px; }
.ml10 { margin-left: 10px; }
.ml15 { margin-left: 15px; }
.ml20 { margin-left: 20px; }
.ml25 { margin-left: 25px; }
.ml30 { margin-left: 30px; }
.ml35 { margin-left: 35px; }
.ml40 { margin-left: 40px; }
.ml45 { margin-left: 45px; }
.ml50 { margin-left: 50px; }

.pt05 { padding-top: 5px; }
.pt10 { padding-top: 10px; }
.pt15 { padding-top: 15px; }
.pt20 { padding-top: 20px; }
.pt25 { padding-top: 25px; }
.pt30 { padding-top: 30px; }
.pt35 { padding-top: 35px; }
.pt40 { padding-top: 40px; }
.pt45 { padding-top: 45px; }
.pt50 { padding-top: 50px; }
.pr05 { padding-right: 5px; }
.pr10 { padding-right: 10px; }
.pr15 { padding-right: 15px; }
.pr20 { padding-right: 20px; }
.pr25 { padding-right: 25px; }
.pr30 { padding-right: 30px; }
.pr35 { padding-right: 35px; }
.pr40 { padding-right: 40px; }
.pr45 { padding-right: 45px; }
.pr50 { padding-right: 50px; }
.pb05 { padding-bottom: 5px; }
.pb10 { padding-bottom: 10px; }
.pb15 { padding-bottom: 15px; }
.pb20 { padding-bottom: 20px; }
.pb25 { padding-bottom: 25px; }
.pb30 { padding-bottom: 30px; }
.pb35 { padding-bottom: 35px; }
.pb40 { padding-bottom: 40px; }
.pb45 { padding-bottom: 45px; }
.pb50 { padding-bottom: 50px; }
.pl05 { padding-left: 5px; }
.pl10 { padding-left: 10px; }
.pl15 { padding-left: 15px; }
.pl20 { padding-left: 20px; }
.pl25 { padding-left: 25px; }
.pl30 { padding-left: 30px; }
.pl35 { padding-left: 35px; }
.pl40 { padding-left: 40px; }
.pl45 { padding-left: 45px; }
.pl50 { padding-left: 50px; }

.tal { text-align: left; }
.tac { text-align: center; }
.tar { text-align: right; }
.fs12 { font-size: 12px; }
.fs14 { font-size: 14px; }
.fs16 { font-size: 16px; }
.fs18 { font-size: 18px; }
.fs20 { font-size: 20px; }
.fs22 { font-size: 22px; }
.fs24 { font-size: 24px; }
.fbold { font-weight: bold; }
.fnormal { font-weight: normal; }

input[type="text"] { outline-style: none; }
input[type="button"] { outline-style: none; }
input[type="submit"] { outline-style: none; }
select { outline-style: none; }
textarea { outline-style: none; }
input[type="password"] { outline-style: none; }
/*
Include this style.
table.baseTable { width: 100%; border-collapse: collapse; }
table.baseTable td { border: 1px solid #CCC; }
*/

/*
.fixedTL{ position: fixed; left: 0; top: 0; }
.fixedTR{ position: fixed; right: 0; top: 0; }
.fixedBL{ position: fixed; left: 0; bottom: 0; }
.fixedBR{ position: fixed; right: 0; bottom: 0; }
*/

/* WebSite Definition
----------------------------------------*/
.wrap { margin: 0 auto; width: 1210px; }

@charset "utf-8";
/* Reset Definitions*/
body, div, p, a, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, form, input, textarea, select, button, th, td { margin: 0; padding: 0; font-family: '宋体'; font-size: 12px; color: #35383e; }
a { text-decoration: none; cursor: pointer; }
img { border: 0; }
img, input, textarea, select, button { vertical-align: middle; }
table, th, td { font-size: 12px; font-family: inherit; line-height: inherit; }
td { word-break: break-all; }
textarea { word-wrap: break-word; word-break: break-all; }
ul, ol, li { list-style: none; }
dl, em, i, u, q, s, caption { font-style: normal; font-weight: normal; text-decoration: none; }

/* Global Definitions
----------------------------------------*/
.fl { float: left; _display: inline; }
.fr { float: right; _display: inline; }
.clear { clear: both; }
.clearfix { display: block; *display: inline-block; _height: 1%; }
.clearfix:after { content: '\20'; display: block; clear: both; height: 0; visibility: hidden; }

.block { display: block; }
.inline { display: inline; }
.inblock { display: inline-block; }

.hide { display: none; }
.hidden { visibility: hidden; }
.ohide { overflow: hidden; }

.mt05 { margin-top: 5px; }
.mt10 { margin-top: 10px; }
.mt15 { margin-top: 15px; }
.mt20 { margin-top: 20px; }
.mt25 { margin-top: 25px; }
.mt30 { margin-top: 30px; }
.mt35 { margin-top: 35px; }
.mt40 { margin-top: 40px; }
.mt45 { margin-top: 45px; }
.mt50 { margin-top: 50px; }
.mr05 { margin-right: 5px; }
.mr10 { margin-right: 10px; }
.mr15 { margin-right: 15px; }
.mr20 { margin-right: 20px; }
.mr25 { margin-right: 25px; }
.mr30 { margin-right: 30px; }
.mr35 { margin-right: 35px; }
.mr40 { margin-right: 40px; }
.mr45 { margin-right: 45px; }
.mr50 { margin-right: 50px; }
.mb05 { margin-bottom: 5px; }
.mb10 { margin-bottom: 10px; }
.mb15 { margin-bottom: 15px; }
.mb20 { margin-bottom: 20px; }
.mb25 { margin-bottom: 25px; }
.mb30 { margin-bottom: 30px; }
.mb35 { margin-bottom: 35px; }
.mb40 { margin-bottom: 40px; }
.mb45 { margin-bottom: 45px; }
.mb50 { margin-bottom: 50px; }
.ml05 { margin-left: 5px; }
.ml10 { margin-left: 10px; }
.ml15 { margin-left: 15px; }
.ml20 { margin-left: 20px; }
.ml25 { margin-left: 25px; }
.ml30 { margin-left: 30px; }
.ml35 { margin-left: 35px; }
.ml40 { margin-left: 40px; }
.ml45 { margin-left: 45px; }
.ml50 { margin-left: 50px; }

.pt05 { padding-top: 5px; }
.pt10 { padding-top: 10px; }
.pt15 { padding-top: 15px; }
.pt20 { padding-top: 20px; }
.pt25 { padding-top: 25px; }
.pt30 { padding-top: 30px; }
.pt35 { padding-top: 35px; }
.pt40 { padding-top: 40px; }
.pt45 { padding-top: 45px; }
.pt50 { padding-top: 50px; }
.pr05 { padding-right: 5px; }
.pr10 { padding-right: 10px; }
.pr15 { padding-right: 15px; }
.pr20 { padding-right: 20px; }
.pr25 { padding-right: 25px; }
.pr30 { padding-right: 30px; }
.pr35 { padding-right: 35px; }
.pr40 { padding-right: 40px; }
.pr45 { padding-right: 45px; }
.pr50 { padding-right: 50px; }
.pb05 { padding-bottom: 5px; }
.pb10 { padding-bottom: 10px; }
.pb15 { padding-bottom: 15px; }
.pb20 { padding-bottom: 20px; }
.pb25 { padding-bottom: 25px; }
.pb30 { padding-bottom: 30px; }
.pb35 { padding-bottom: 35px; }
.pb40 { padding-bottom: 40px; }
.pb45 { padding-bottom: 45px; }
.pb50 { padding-bottom: 50px; }
.pl05 { padding-left: 5px; }
.pl10 { padding-left: 10px; }
.pl15 { padding-left: 15px; }
.pl20 { padding-left: 20px; }
.pl25 { padding-left: 25px; }
.pl30 { padding-left: 30px; }
.pl35 { padding-left: 35px; }
.pl40 { padding-left: 40px; }
.pl45 { padding-left: 45px; }
.pl50 { padding-left: 50px; }

.tal { text-align: left; }
.tac { text-align: center; }
.tar { text-align: right; }
.fs12 { font-size: 12px; }
.fs14 { font-size: 14px; }
.fs16 { font-size: 16px; }
.fs18 { font-size: 18px; }
.fs20 { font-size: 20px; }
.fs22 { font-size: 22px; }
.fs24 { font-size: 24px; }
.fbold { font-weight: bold; }
.fnormal { font-weight: normal; }

input[type="text"] { outline-style: none; }
input[type="button"] { outline-style: none; }
input[type="submit"] { outline-style: none; }
select { outline-style: none; }
textarea { outline-style: none; }
input[type="password"] { outline-style: none; }
/*
Include this style.
table.baseTable { width: 100%; border-collapse: collapse; }
table.baseTable td { border: 1px solid #CCC; }
*/

/*
.fixedTL{ position: fixed; left: 0; top: 0; }
.fixedTR{ position: fixed; right: 0; top: 0; }
.fixedBL{ position: fixed; left: 0; bottom: 0; }
.fixedBR{ position: fixed; right: 0; bottom: 0; }
*/

/* WebSite Definition
----------------------------------------*/
.wrap { margin: 0 auto; width: 1210px; }
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: