CSS公共样式

ゝ一纸荒年。 2021-09-14 12:02 353阅读 0赞

创建base.css样式文件。

body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { margin:0; padding:0; }
    body, button, input, select, textarea { font:12px Arial, Tahoma, 宋体; color:#454545; }
    button, input, select, textarea, h1, h2, h3, h4, h5, h6 { font-size:100%; }
    h2, h3 { font-size:14px; }
    button, input, select, textarea, label { vertical-align:middle; outline:none; }
    img { vertical-align:middle; border:none; display:inline-block; background:#fff url(/images/common/nopic.png) center no-repeat; }
    ul, ol { list-style:none; }
    a { text-decoration:none; color:#454545; vertical-align:baseline; cursor:pointer; }
    a:hover { text-decoration:underline; color:#000; }
    table { border-collapse:collapse; border-spacing:0; }
    body { word-wrap:break-word; word-break:break-all; _height:100%; }
    
    /*输入框*/
    .g-txt { height:23px; line-height:23px; border-width:1px; border-style:solid; border-color:#454545 #ccc #ccc #454545; padding-left:3px; }
    .g-txt:hover, .g-txt.focus { background-color:#fffcc5; }
    /*--------------*/
    /*--------------*/
    /*单项公共样式开始*/
    /*--------------*/
    /*--------------*/
    /*顶底边框*/
    .g-bt-n { border-top:none !important; }
    .g-bb-n { border-bottom:none !important; }
    .g-b-dd { border:1px solid #dddddd; }
    /*背景色*/
    .g-bc-w { background-color:#fff }
    .g-bi-n { background-image:none !important; }
    /*字体灰色*/
    .g-c-22 { color:#222; }
    .g-c-33 { color:#333; }
    .g-c-66 { color:#666; }
    .g-c-99 { color:#999; }
    /*字体白色*/
    .g-c-w { color:#fff; }
    /*字体红色*/
    .g-c-r { color:#e25150; }
    /*绿色*/
    .g-c-green { color:#579719; }
    /*清浮*/
    .g-cf:after { content:""; clear:both; display:table; }
    .g-cf { zoom:1; }
    /*浮动*/
    .g-f-l { float:left !important; _display:inline; }
    .g-f-r { float:right !important; _display:inline; }
    /*显示隐藏*/
    .g-d-n { display:none; }
    .g-d-b { display:block; }
    .g-d-i { display:inline; }
    .g-d-ib { display:inline-block; }
    .g-v-h { visibility:hidden; }
    .g-v-v { visibility:visible; }
    /*字体宋体*/
    .g-ff-s { font-family:宋体; }
    /*字体风格*/
    .g-fs-n { font-style:normal; }
    /*字体加粗*/
    .g-fw-b { font-weight:bold; }
    .g-fw-n { font-weight:normal; }
    /*字体大小*/
    .g-fz-18 { font-size:18px; }
    .g-fz-16 { font-size:16px; }
    .g-fz-15 { font-size:15px; }
    .g-fz-14 { font-size:14px; }
    .g-fz-12 { font-size:12px; }
    /*高、行高*/
    .g-h-a { height:auto !important; }
    .g-lh-18 { line-height:18px !important; }
    .g-h-22 { height:22px !important; }
    .g-lh-22 { line-height:22px !important; }
    .g-h-24 { height:24px !important; }
    .g-lh-24 { line-height:24px !important; }
    .g-h-25 { height:25px !important; }
    .g-lh-25 { line-height:25px !important; }
    .g-lh-30 { line-height:30px !important; }
    /*最小高度*/
    .g-mh-20 { min-height:20px; _height:20px; }
    .g-mh-50 { min-height:50px; _height:50px; }
    /*外边距*/
    .g-mlr-a { margin-left:auto; margin-right:auto; }
    .g-m-10 { margin:10px; }
    .g-mtb-10 { margin-top:10px; margin-bottom:10px; }
    .g-mlr-10 { margin-left:10px; margin-right:10px; }
    .g-mt-10 { margin-top:10px; }
    .g-mb-10 { margin-bottom:10px; }
    .g-ml-10 { margin-left:10px; }
    .g-mr-10 { margin-right:10px; }
    .g-m-5 { margin:5px; }
    .g-mtb-5 { margin-top:5px; margin-bottom:5px; }
    .g-mlr-5 { margin-left:5px; margin-right:5px; }
    .g-mt-5 { margin-top:5px !important; }
    .g-mb-5 { margin-bottom:5px !important; }
    .g-ml-5 { margin-left:5px !important; }
    .g-mr-5 { margin-right:5px !important; }
    .g-mt-n { margin-top:0 !important; }
    .g-mb-n { margin-bottom:0 !important; }
    .g-ml-n { margin-left:0 !important; }
    .g-mr-n { margin-right:0 !important; }
    /*内边距*/
    .g-p-10 { padding:10px; }
    .g-ptb-10 { padding-top:10px; padding-bottom:10px; }
    .g-plr-10 { padding-left:10px; padding-right:10px; }
    .g-pt-10 { padding-top:10px; }
    .g-pb-10 { padding-bottom:10px; }
    .g-pl-10 { padding-left:10px; }
    .g-pr-10 { padding-right:10px; }
    .g-p-5 { padding:5px; }
    .g-ptb-5 { padding-top:5px; padding-bottom:5px; }
    .g-plr-5 { padding-left:5px; padding-right:5px; }
    .g-pt-5 { padding-top:5px !important; }
    .g-pb-5 { padding-bottom:5px !important; }
    .g-pl-5 { padding-left:5px !important; }
    .g-pr-5 { padding-right:5px !important; }
    .g-pt-n { padding-top:0 !important; }
    .g-pb-n { padding-bottom:0 !important; }
    .g-pl-n { padding-left:0 !important; }
    .g-pr-n { padding-right:0 !important; }
    .g-pt-20 { padding-top:20px !important; }
    /*overflow*/
    .g-o-h { overflow:hidden !important; }
    .g-o-a { overflow:auto !important; }
    .g-o-v { overflow:visible!important; }
    /*相对定位*/
    .g-p-r { position:relative; }
    /*水平右中左*/
    .g-ta-r { text-align:right !important; }
    .g-ta-c { text-align:center !important; }
    .g-ta-l { text-align:left !important; }
    /*垂直上中下*/
    .g-va-t { vertical-align:top !important; }
    .g-va-m { vertical-align:middle !important; }
    .g-va-b { vertical-align:bottom !important; }
    .g-va-bl { vertical-align:baseline !important; }
    /*缩进*/
    .g-ti-1 { text-indent:1em; }
    .g-ti-2 { text-indent:2em; }
    .g-ti-3 { text-indent:3em; }
    .g-ti-4 { text-indent:4em; }
    .g-ti-5 { text-indent:5em; }
    /*下划线*/
    .g-td-n { text-decoration:none !important; }
    /*强制不换行*/
    .g-ws-w { white-space:nowrap; }
    /*强制换行*/
    .g-ww-bw { white-space:normal; word-wrap:break-word; word-break:break-all; }