www.gusucode.com > 51:【198-3365】仿寻模板网页模板下载素材销售下载站平台织梦模板 > 51:【198-3365】仿寻模板网页模板下载素材销售下载站平台织梦模板/templets/css/base.css
/* 织梦58(dede58.com)做最好的织梦整站模板下载网站 */ /** * CSS Global Style * @author: LangLee; * @data: 2014-06-17; **/ /** * 初始化浏览器默认样式 **/ html, body, div, ol, ul, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, input, button, textarea, p, span, table, th, td, from { margin: 0; padding: 0 } body, input, button, select, textarea { font: 12px/1.5 "Microsoft Yahei", "Helvetica Neue"; color: #34495e; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -moz-font-feature-settings: "liga", "kern"; } table { border-collapse: collapse; border-spacing: 0 } img, a img { border: 0 } a { color: #369; outline: medium none; text-decoration: none; star:expression(this.onFocus=this.blur()) } a:hover { text-decoration: none } label { cursor: pointer } ul li, .ol li { list-style: none } em, cite, i { font-style: normal } p { word-break: break-all; } /*全部英文字符下自动换行*/ /* 去除Chrome等浏览器文本框默认发光边框 */ input:focus, textarea:focus { outline: none; } /* 去除IE10+浏览器文本框后面的小叉叉 */ input::-ms-clear { display: none; } /* 禁止多行文本框textarea拖拽 */ textarea { resize: none; } /* ==全局通用样式== */ /* 避免因子元素浮动而导致的父元素高度缺失能问题 */ .cl:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .cl { zoom: 1; } /* 浮动 */ .z { float: left !important; } .y { float: right !important; } /* 鼠标样式,可以根据需要按序添加 */ .cur1 { cursor: pointer; } /* 显示/隐藏 */ .show { display: block !important; } .hide { display: none !important; } /* 相对定位 */ .pos { position: relative; } /* 灰色 */ .grays { filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */ -webkit-filter: grayscale(100%); /* chrome+ */ filter: grayscale(100%); /* 未来浏览器 */ filter: gray; /* ie6-8 */ filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);/*ie6-9 */ } /* 通用容器,定义页面宽度 具有 n, m, w 三个级别 */ .wpn { width: 1180px; margin: 0 auto; } /* 4 列 * 300 */ .wpm { width: 1480px; margin: 0 auto; } /* 5 列 * 300 */ .wpw { width: 1780px; margin: 0 auto; } /* 6 列 * 300 */ .wpf { width: 100%; max-width: 1260px; margin: 0 auto; } /* 4 列 * 300 */ /*实际宽度1180+左右边距各40*/ .wpf-row { width: 93.6507936%; margin: 0 3.1746031%; } /*1180/1260,40/1260*/ .row { width: 100% } /* 主体内容 */ .ct { display: block; min-height: 530px; } /* 主体内容 - 带边栏 */ /*.ctn .mn { width: 880px; float: left; } .ctn .sd { width: 280px; float: right; }*/ .ctn .mn { margin: 0 300px 0 0; padding-top: 20px; } .ctn .sd { position: absolute; right: 280px; top: 0; bottom: 0; } /* 文本属性:字号、颜色、粗细、正斜 */ /* 字号 */ .f12 { font-size: 12px; } .f14 { font-size: 14px; } .f16 { font-size: 16px; } .f26 { font-size: 26px; } /* 颜色 */ .b8c5ce { color: #b8c5ce; } .ff8326 { color: #ff8326; } /* 粗细 */ .b { font-weight: bold; } /* 正斜 */ .i { font-style: italic; } /* 外边距样式,作用于元素的上下外边距,上下各具有 n, m, w 三个级别 */ .mtn { margin-top: 5px !important; } .mtm { margin-top: 10px !important; } .mtw { margin-top: 20px !important; } .mbn { margin-bottom: 5px !important; } .mbm { margin-bottom: 10px !important; } .mbw { margin-bottom: 20px !important; } .mrn { margin-right: 5px !important; } .mrm { margin-right: 10px !important; } .mrw { margin-right: 20px !important; }/*20/1180=1.6949152%*/ .mln { margin-left: 5px !important; } .mlm { margin-left: 10px !important; } .mlw { margin-left: 20px !important; } .mtbn { margin: 5px 0 !important; } .mtbm { margin: 10px 0 !important; } .mtbw { margin: 20px 0 !important; } .mlrn { margin: 0 5px !important; } .mlrm { margin: 0 10px !important; } .mlrw { margin: 0 20px !important; } /* 内边距样式,作用于元素的上下内边距,上下各具有 n, m, w 三个级别 */ .ptn { padding-top: 5px !important; } .ptm { padding-top: 10px !important; } .ptw { padding-top: 20px !important; } .pbn { padding-bottom: 5px !important; } .pbm { padding-bottom: 10px !important; } .pbw { padding-bottom: 20px !important; } .ptbn { padding: 5px 0 !important; } .ptbm { padding: 10px 0 !important; } .ptbw { padding: 20px 0 !important; } .plrn { padding: 0 5px !important; } .plrm { padding: 0 10px !important; } .plrw { padding: 0 20px !important; } /* ==== loding 2015-4-8 ===*/ .loding { background-image: url("../img/loding.gif"); background-repeat: no-repeat; background-position: center center; background-size: 20px; } .loding2 { background-image: url("../img/loding2.gif")!important; background-color: #3499DA !important; background-repeat: no-repeat; background-position: center center; background-size: 20px; } /* ==== 按钮 Buttons 2015-1-12==== */ .lang-btn { display: inline-block; position: relative; vertical-align: middle; cursor: pointer; white-space: nowrap; background-color: #3499DA; height: 40px; line-height: 40px; font-size: 16px; color: #FFF; border: none; letter-spacing: 1px; overflow: hidden; text-align: center; border-radius: 2px; } /* 无背景按钮 */ .lang-cancel { background: 0; color: #2d3e50 } /* 取消按钮 */ .lang-btn-none { background: #e4e9ed; color: #2d3e50; } .lang-btn-none:hover { background: #e4e9ed; color: #2d3e50; } .lang-btn-c { display: inline-block; position: relative; vertical-align: middle; cursor: pointer; white-space: nowrap; background: #e4e9ed; height: 40px; line-height: 40px; font-size: 16px; color: #2d3e50; border: 0; letter-spacing: 1px; overflow: hidden; text-align: center; border-radius: 2px } /* 修改按钮的默认状态 */ .lang-btn:active { outline: 0; box-shadow: none } .lang-btn:focus { border: 0; outline: 0; box-shadow: none } .lang-btn:hover { text-decoration: none } /* 火狐兼容 */ .lang-btn::-moz-focus-inner { border: 0; padding: 0; } /* 成功 */ .lang-btn-success { background-color: #4a993e; } /* 错误 */ .lang-btn-eroor { background-color: #b33630; } /* 不可提交状态 */ .lang-btn-disabled { background-color: #ddd; color: #777; cursor: default; } /* 展示 */ .lang-btn-show { background-color: #e4e9ed; color: #2d3e50; cursor: default; } /* 关联 */ .lang-btn-relating { background-color: #b8c5ce; color: #2d3e50; } /* 按钮文字 */ .lang-btn .lang-btn-content { padding: 0 30px; display: block; } /* 大的 */ .lang-btn-big .lang-btn-content { padding: 0 45px; } /* 巨大的 */ .lang-btn-huge { height: 50px; line-height: 50px; } .lang-btn-huge .lang-btn-content { padding: 0 45px; } /* 按钮的颜色 */ .lang-btn-col-blue { background: #3499DA; color: #fff; } .lang-btn-col-blue:hover { background: #3da2e3; color: #fff; } /* 固定宽度的 */ .lang-btn-fixed-small { width: 100px; } .lang-btn-fixed-small .lang-btn-content { padding: 0; } .lang-btn-fixed-big { width: 160px; } .lang-btn-fixed-big .lang-btn-content { padding: 0; } .lang-btn-fixed-Large { width: 100%; } .lang-btn-fixed-Large .lang-btn-content { padding: 0; } /* 小字号按钮 举报弹出框再用 */ .submit-button { width: 80px; height: 40px; background: #3499da; color: #fff; font-size: 14px; cursor: pointer; line-height: 40px; border: 0; border-radius: 2px } .submit-button:hover { background: #3da2e3; transition: all .4s ease-in-out 0s } .submit-button:active { background: #2e93d4 } .mini-button-disabble { width: 80px; height: 40px; background: #b8c5ce; color: #fff; font-size: 14px; cursor: pointer; line-height: 40px; border: 0; border-radius: 2px } .mini-button-disabble:hover { background: #c8d4db; transition: all .4s ease-in-out 0s } .mini-button-disabble:active { background: #a9b9c3 } /* 按钮 Buttons END */ /* ==== 表单 Input 框 2015-2-28==== 以前的颜色b8c4ce*/ .lang-input { padding: 14px 15px; height: 20px; border: #e4e9ed 1px solid; border-radius: 2px; background: #fff; color: #5d6d7e; font-size: 16px; line-height: 20px; box-sizing: content-box; } .lang-input:focus { border: 1px solid #3498db; box-shadow: 0 0 4px rgba(41, 128, 185, 0.4); } /* 焦点/成功 */ .lang-input-on, .lang-input-success { border: #3498db 1px solid; box-shadow: 0 0 4px rgba(41, 128, 185, 0.4); color: #34495e; } /* 错误 */ .lang-input-error { border: #fcab2b 1px solid; box-shadow: 0 0 4px rgba(252, 171, 43, 0.4); } /* form 表单固定宽度 */ .w520 { width: 488px; } /* 实际宽度520-内边距左右各15px-边框2 */ .w880 { width: 848px; } /* 实际宽度520-内边距左右各15px-边框2 */ .w580 { width: 548px; } /* 实际宽度520-内边距左右各15px-边框2 */ /* textarea使用 */ .h164 { height: 130px; } .lh20 { line-height: 24px; } .lang-must { position: absolute; right: 11px; color: #FD8335!important; line-height: 50px!important; } /* 表单 Input 框 END */ /* ====注册输入框 2015-1-12==== */ .login-icon { display: block; height: 40px; width: 100%; border-bottom: #e9ecee 1px solid; margin-top: 30px; } /* 输入框活动状态/成功 */ .login-on, .login-success { border-bottom: #3498db 1px solid; } .login-on .log-input, .login-error .log-input, .login-success .log-input { color: #5d6d7e; } .login-on .iconfont, .login-success .iconfont { color: #3A99D8; } /* 错误 */ .login-error { border-bottom: #fcab2b 1px solid; } .login-error .iconfont { color: #fcab2b; } /* 登录输入框 */ .log-input { border: none; height: 20px; font-size: 16px; padding: 10px 2.5%; line-height: 20px; color: #b8c4ce; background: #fff; width: 90%; } /*30/400=7.5%,360/400=90%,10/400=2.5%*/ .log-input-half { border: none; height: 20px; font-size: 16px; padding: 10px 5%; line-height: 20px; color: #b8c4ce; background: #fff; width: 80%; } /*30/200=15%,160/200=80%,10/200=5%*/ .log-input::-moz-placeholder { color: #b8c4ce; } .log-input::-ms-input-placeholder { color: #b8c4ce; } .log-input::-webkit-input-placeholder { color: #b8c4ce; } .log-input:placeholder { color: #b8c4ce; } textarea::-moz-placeholder { color: #b8c4ce; } textarea::-ms-input-placeholder { color: #b8c4ce; } textarea::-webkit-input-placeholder { color: #b8c4ce; } textarea:placeholder { color: #b8c4ce; } /* 注册输入框 end */ /*message 提醒消息*/ #ajax-hook { position: fixed; top: 0; z-index: 99999; width: 100%; } .globalInfoTip { z-index: 20; height: 60px; width: 100%; position: relative; cursor: pointer; } .globalInfoTip p { text-align: center; font-size: 16px; height: 30px; line-height: 30px; padding: 15px 0; color: #FFF; position: relative; } .globalInfoTip .infoTipBack { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: #3498db; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); opacity: 0.8; filter: alpha(opacity=80); -moz-opacity: 0.8; -khtml-opacity: 0.8; } /* 没有任何内容的时候提示 */ .kong { width: 100%; background: url("../img/serch-null.png") no-repeat center center; height: 700px; } /*字体图标*/ .fa.fa-qrcode { font-size: 42px; margin-left: 8px; }