/* ================================ */ /* 全局初始化 */ /* ================================ */ /* =============== * 重新定义Html元素 * =============== */ html, body, div, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, fieldset, input { padding: 0; margin: 0; } h1, h2, h3, h4, h5, h6, pre, code, address, caption, cite, code, em, strong, table, th, td { font-size: 1em; font-style: normal; font-weight: normal; } strong { font-weight: bold; } ul, ol { list-style: none outside none; } fieldset, img { border: medium none; vertical-align: middle; } caption, th { text-align: left; } table { border-collapse: collapse; border-spacing: 0; } body { font: 12px/20px "Hiragino Sans GB", "Microsoft Yahei", arial, 宋体, "Helvetica Neue", Helvetica, STHeiTi, sans-serif; color: #666; background: #FFF none repeat scroll 0 0; min-width: 1200px; } input, select, textarea { font: 12px/20px Tahoma, Helvetica, Arial, "\5b8b\4f53", sans-serif; } i, cite, em { font-style: normal; } input, button, select, textarea { outline:none } html { min-height:101%; } /* 链接 */ a { color: #333; text-decoration: none; outline: medium none; -webkit-transition-property:color; -webkit-transition-duration: 0.3s; -webkit-transition-timing-function: ease; } a:link, a:visited, a:active { text-decoration: none; } a:hover { color: #C81623; text-decoration: none; } /* 超出隐藏(需要再设置宽高) */ .over_hidden { display: block; overflow-x: hidden; overflow-y: hidden; text-overflow: ellipsis; white-space: nowrap; } /* input放大by input_max.js */ .parentCls { display: inline-block; *display: inline/*IE7*/; *zoom: 1; } .js-max-input { font-size: 20px; color: #F40; background: #FFFAE5; white-space: nowrap; padding: 7px; border: solid 1px #FFD2B2; } /* Clearfix,避免因子元素浮动而导致的父元素高度缺失能问题 */ .clearfix:after { clear: both; content: "."; display: block; height: 0; line-height: 0; visibility: hidden; } .clearfix { display: inline-block; } html[xmlns] .clearfix { display: block; } *html .clearfix { height:1%; } *+html .clearfix { height:1%; } time { color: #777; } /* ========================== * 为旧版本浏览器格式化Html5元素 * ========================== */ article, aside, dialog, footer, header, section, footer, nav, figure, menu { display:block; } /*文字排版 ******************************/ .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; } .lh150 { line-height:150% } .lh180 { line-height:180% } .lh200 { line-height:200% } .unl { text-decoration:underline; } .no_unl { text-decoration:none; } .noborder { border-style:none!important; border-width: 0!important; } /*定位 ******************************/ .tl { text-align:left !important; } .tc { text-align:center !important; } .tr { text-align:right !important; } .bc { margin-right:auto; margin-left:auto; } .fl { float:left; display:inline; } .fr { float:right !important; display:inline; } .cb { clear:both; } .cl { clear:left; } .cr { clear:right; } .vm { vertical-align: middle; } .vt { vertical-align: top; } .pr { position:relative; } .pa { position:absolute; } .abs-right { position:absolute; right:0; } .zoom { zoom:1 } /*.hidden { visibility:hidden;*/} .none { display:none; } .clear { clear: both; height: 0; font-size: 0; line-height:0; } /*长度高度 ******************************/ .w10 { width:10px; } .w20 { width:20px; } .w30 { width:30px; } .w40 { width:40px !important; } .w50 { width:50px !important; } .w60 { width:60px !important; } .w65 { width:65px !important; } .w70 { width:70px !important; } .w80 { width:80px !important; } .w90 { width:90px; } .w96 { width: 96px; } .w100 { width:100px !important; } .w110 { width:110px !important; } .w120 { width:120px !important; } .w130 { width:130px !important; } .w150 { width:150px !important; } .w160 { width:160px; } .w180 { width:180px; } .w200 { width:200px !important; } .w210 { width:210px !important; } .w230 { width:230px; } .w240 { width:240px; } .w250 { width:250px !important; } .w270 { width:270px; } .w300 { width:300px !important; } .w340 { width:340px; } .w380 { width:380px; } .w400 { width:400px!important; } .w450 { width:450px!important; } .w500 { width:500px; } .w530 { width:530px; } .w600 { width:600px !important; } .w700 { width:700px; } .w780 { width: 780px; } .w800 { width:800px; } .w208 { width: 208px; } .w { width:100%; } .h20 { height: 20px !important; } .h30 { height: 30px !important; } .h40 { height: 40px !important; } .h50 { height: 50px !important; } .h80 { height: 80px; } .h100 { height:100px !important; } .h200 { height:200px; } .h500 { height:500px !important; } .h { height:100% } .size30 { width: 30px; height: 30px; } .size32 { width: 32px; height:32px; } .size40 { width: 40px; height:40px; } .size60 { width: 60px; height:60px; } .size70 { width: 70px; height: 70px; } .size72 { width: 72px; height: 72px; } .size75 { width: 75px; height: 75px; } .size80 { width: 80px; height:80px; } .size90 { width: 90px; height:90px; } .size100 { width: 100px; height: 100px; } .size110 { width: 110px; height: 110px; } .size120 { width: 120px; height: 120px; } .size128 { width: 128px; height: 128px; } .size160 { width: 160px; height: 160px; } .size160-48 { width: 160px; height: 48px; } .size160 { width: 160px; height: 160px; } .size184 { width: 184px; height: 114px; } .size190 { width: 190px; height: 190px; } .size196 { width: 196px; height: 196px; } .size233 { width: 233px; } /*边距 ******************************/ .m0 { margin: 0!important; } .m10 { margin:10px; } .m15 { margin:15px !important; } .m30 { margin:30px; } .mt5 { margin-top:5px; } .mt10 { margin-top:10px !important; } .mt15 { margin-top:15px; } .mt20 { margin-top:20px !important; } .mt30 { margin-top:30px !important; } .mt50 { margin-top:50px !important; } .mt100 { margin-top:100px; } .mb5 { margin-bottom:5px !important; } .mb10 { margin-bottom:10px !important; } .mb15 { margin-bottom:15px; } .mb20 { margin-bottom:20px; } .mb30 { margin-bottom:30px !important; } .mb50 { margin-bottom:50px; } .mb100 { margin-bottom:100px; } .ml5 { margin-left:5px!important; } .ml10 { margin-left:10px!important; } .ml15 { margin-left:15px; } .ml20 { margin-left:20px; } .ml30 { margin-left:30px; } .ml50 { margin-left:50px; } .ml100 { margin-left:100px !important; } .ml200 { margin-left:200px !important; } .mr5 { margin-right:5px !important; } .mr10 { margin-right:10px !important; } .mr15 { margin-right:15px !important; } .mr20 { margin-right:20px; } .mr30 { margin-right:30px !important; } .mr50 { margin-right:50px !important; } .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; } .pt100 { padding-top:100px; } .pb5 { padding-bottom:5px; } .pb10 { padding-bottom:10px; } .pb15 { padding-bottom:15px; } .pb20 { padding-bottom:20px !important; } .pb30 { padding-bottom:30px; } .pb50 { padding-bottom:50px; } .pb100 { padding-bottom:100px; } .pl5 { padding-left:5px; } .pl10 { padding-left:10px; } .pl15 { padding-left:15px; } .pl20 { padding-left:20px; } .pl30 { padding-left:30px; } .pl50 { padding-left:50px; } .pl100 { padding-left:100px; } .pr5 { padding-right:5px; } .pr10 { padding-right:10px; } .pr15 { padding-right:15px; } .pr20 { padding-right:20px; } .pr30 { padding-right:30px; } .pr50 { padding-right:50px; } .pr100 { padding-right:100px; } .hr { font-size: 1px; display: block; height: 0; margin: 12px 0; border-top: 1px solid #E3E3E3; overflow: hidden; } .hr-double { height: 1px; border-top: 1px solid #E3E3E3; border-bottom: 1px solid #E3E3E3; } .hr8 { margin: 8px 0 !important; } .hr12 { margin: 12px 0 !important; } .hr16 { margin: 16px 0 !important; } .hr18 { margin: 18px 0 !important; } .hr24 { margin: 24px 0 !important; } .hr32 { margin: 32px 0 !important; } .hr.dotted { border-top-style: dotted; } .hr-double.dotted { border-bottom-style: dotted; } /* ===================== * 表单元素格式化及伪类效果 * ===================== */ input[type="text"], input[type="password"], input.text, input.password { font: 12px/20px Arial; color: #777; background-color: #FFF; vertical-align: top; display: inline-block; height: 20px; padding: 6px 8px; border: solid 1px #E6E9EE; outline: 0 none; } input[type="text"]:focus, input[type="password"]:focus, input.text:focus, input.password:focus, textarea:focus { color: #333; border-color: #CCD0D9; outline: 0 none; } input[type="text"].error, input[type="password"].error, textarea.error { border: dashed 1px #ED5564; outline: 0 none; } textarea, .textarea { font: 12px/18px Arial; color: #777; background-color: #FFF; vertical-align: top; display: inline-block; height: 54px; padding: 6px 8px; border: solid 1px #CCD0D9; outline: 0 none; } select, .select { color: #777; background-color: #FFF; height: 34px; vertical-align: middle; *display: inline; padding: 8px 8px; border: solid 1px #E6E9EE; *zoom:1; } select option, .select option { line-height: 22px; display: block; height: 22px; padding: 8px 8px; } /* input[type="radio"], .radio { vertical-align: middle; display: inline-block; margin-right: 5px; } */ .submit-border { vertical-align: middle; display: inline-block; *display: inline/*IE6,7*/; *zoom: 1; } input[type="submit"], input.submit, a.submit { font-size: 12px; line-height: 30px; font-weight: bold; color: #FFF; background-color: #48CFAE; display: block; height: 30px; padding: 0 20px; border-radius: 3px; border: none 0; cursor: pointer; } input[type="submit"]:hover, input.submit:hover, a.submit:hover { text-decoration: none; color: #FFF; background-color: #36BC9B; } input[type="file"] { line-height:20px; background-color:#FBFBFB; height: 20px; border: solid 1px #D8D8D8; cursor: default; } .add-on { line-height: 28px; background-color: #F6F7Fb; vertical-align: top; display: inline-block; text-align: center; width: 28px; height: 28px; border: solid #E6E9EE; border-width: 1px 1px 1px 0; } .add-on { *display: inline/*IE6,7*/; zoom:1; } .add-on i { font-size: 14px; color: #434A54; *margin-top: 8px/*IE7*/; margin-right: 0!important; } /*表单验证错误提示文字*/ label.error { font-size: 12px; color: #ED5564 !important; margin-left: 8px; } label.error i { margin-right: 4px; } /* 常用标准按钮样式定义 -------------------------------------------*/ a.ncbtn-mini, a.ncbtn { font: normal 12px/20px "microsoft yahei", arial; color: #FFF; background-color: #CCD0D9; text-align: center; vertical-align: middle; display: inline-block; *display: inline; height: 20px; padding: 5px 10px; border-radius: 3px; cursor: pointer; *zoom: 1; } a.ncbtn-mini { line-height: 16px; height: 16px; padding: 3px 7px; border-radius: 2px; } a.ncbtn { height: 20px; padding: 5px 10px; border-radius: 3px; } a:hover.ncbtn-mini, a:hover.ncbtn { text-decoration: none; color: #FFF; background-color: #AAB2BD; } a.ncbtn-mini i, a.ncbtn i { font-size: 14px !important; vertical-align: middle; margin: 0 4px 0 0 !important; } /*葡萄柚红*/ a.ncbtn-grapefruit { background-color: #ED5564; } a:hover.btn-grapefruit, a:hover.ncbtn-grapefruit { background-color: #DB4453; } /*白英橘*/ a.ncbtn-bittersweet { background-color: #FB6E52; } a:hover.btn-bittersweet, a:hover.ncbtn-bittersweet { background-color: #E9573E; } /*向日葵黄*/ a.ncbtn-sunflower { color: #000; background-color: #FFCE55; } a:hover.btn-sunflower, a:hover.ncbtn-sunflower { color: #000; background-color: #F6BB43; } /*青草绿*/ a.ncbtn-grass { background-color: #A0D468; } a:hover.btn-grass, a:hover.ncbtn-grass { background-color: #8CC051; } /*薄荷绿*/ a.ncbtn-mint { background-color: #48CFAE; } a:hover.btn-mint, a:hover.ncbtn-mint { background-color: #36BC9B; } /*水绿*/ a.ncbtn-aqua { background-color: #4FC0E8; } a:hover.btn-aqua, a:hover.ncbtn-aqua { background-color: #3BAEDA; } /*牛仔蓝*/ a.ncbtn-bluejeansjeans { background-color: #5D9CEC; } a:hover.btn-bluejeans, a:hover.ncbtn-bluejeansjeans { background-color: #4B89DC; } /*薰衣草紫*/ a.ncbtn-lavander { background-color: #AC92ED; } a:hover.btn-lavander, a:hover.ncbtn-lavander { background-color: #967BDC; } /*玫瑰粉*/ a.ncbtn-lavander { background-color: #EC87BF; } a:hover.btn-lavander, a:hover.ncbtn-lavander { background-color: #D870AD; } /*浅灰色*/ a.ncbtn-lightgray { color: #656D78; background-color: #F6F7FB; } a:hover.btn-lightgray, a:hover.ncbtn-lightgray { color: #434A54; background-color: #E6E9EE; } /*中灰色*/ a.ncbtn-mediumgray { background-color: #CCD0D9; } a:hover.btn-mediumgray, a:hover.ncbtn-mediumgray { background-color: #AAB2BD; } /*灰黑*/ a.ncbtn-darkgray { background-color: #656D78; } a:hover.btn-darkgray, a:hover.ncbtn-darkgray { background-color: #434A54; } /* 全局布局 */ .container_page { width: 1200px; margin: 0 auto; } .ignore { overflow:hidden; /*超出的部分隐藏起来*/ white-space:nowrap; /*不显示的地方用省略号...代替*/ text-overflow:ellipsis; /* 支持 IE */ word-wrap:break-word; word-break:break-all; } ._bottom { user-select: none !important; background: #1466d2 !important; color: #fff !important; cursor: pointer; padding: 7px 14px; border-radius: 4px; } ._bottom:hover { color: #ffefef !important; background: #1d70de !important; } /* checkbox */ input[type="checkbox"]{ width:20px; height:20px; display: inline-block; text-align: center; vertical-align: middle; line-height: 18px; position: relative; } input[type="checkbox"]::before{ content: ""; position: absolute; top: 0;left: 0; background: #fff; width: 100%;height: 100%; border: 1px solid #d9d9d9 } .divCheckbox:checked::before{ content: "\2713"; background-color:#fff; position: absolute;top: 0; left: 0;width:100%; border: 1px solid #1868D2; color:#1868D2; font-size: 20px; font-weight: bold; } /* /*取紧邻input的下一个label radio*/ input[type="radio"]+label{ width: 14px;height: 14px; display: inline-block; border: 1px solid #189cfb; border-radius: 50%; text-align: center; line-height: 14px; margin-right: 5px; } input[type="radio"]{ display: none; } input[type="radio"]+label:after{ transition: 0.3s; transform: scale(0.8); content: ''; display: inline-block; width: 10px;height: 10px;border-radius: 50%; background-color: #fff; } input[type="radio"]:checked+label:after{ background-color: #189cfb;transform: scale(1); } /*不可选中*/ input[type="radio"]:disabled+label{ border-color: #aaa; } input[type="radio"]:disabled+label+label{ color: #aaa;text-decoration: line-through; }