@charset "utf-8"; /* 防止用户自定义背景颜色对网页的影响，添加让用户可以自定义字体 */ html { color: #333; background: #fff; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; text-rendering: optimizelegibility; } /* 如果你的项目仅支持 IE9+ | Chrome | Firefox 等，推荐在 中添加 .borderbox 这个 class */ *, *:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } /* 内外边距通常让各个浏览器样式的表现位置不同 */ body, 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, menu, nav, section { margin: 0; padding: 0; } /* 重设 HTML5 标签, IE 需要在 js 中 createElement(TAG) */ article, aside, details, figcaption, figure, footer, header, menu, nav, section { display: block; } /* HTML5 媒体文件跟 img 保持一致 */ audio, canvas, video { display: inline-block; } /* 要注意表单元素并不继承父级 font 的问题 */ body, button, input, select, textarea { font: 300 1em/1.8 Microsoft Yahei, Hiragino Sans GB, Microsoft Sans Serif, WenQuanYi Micro Hei, sans; } button::-moz-focus-inner, input::-moz-focus-inner { padding: 0; border: 0; } /* 去掉各Table cell 的边距并让其边重合 */ table { border-collapse: collapse; border-spacing: 0; } /* 去除默认边框 */ fieldset, img { border: 0; } /* 块/段落引用 */ blockquote { position: relative; color: #999; font-weight: 400; border-left: 1px solid #1abc9c; padding-left: 1em; margin: 1em 3em 1em 2em; } @media only screen and ( max-width: 640px ) { blockquote { margin: 1em 0; } } /* Firefox 以外，元素没有下划线，需添加 */ acronym, abbr { border-bottom: 1px dotted; font-variant: normal; } /* 添加鼠标问号，进一步确保应用的语义是正确的（要知道，交互他们也有洁癖，如果你不去掉，那得多花点口舌） */ abbr { cursor: help; } /* 一致的 del 样式 */ del { text-decoration: line-through; } address, caption, cite, code, dfn, em, th, var { font-style: normal; font-weight: 400; } /* 去掉列表前的标识, li 会继承，大部分网站通常用列表来很多内容，所以应该当去 */ ul, ol { list-style: none; } /* 对齐是排版最重要的因素, 别让什么都居中 */ caption, th { text-align: left; } q:before, q:after { content: ''; } /* 统一上标和下标 */ sub, sup { font-size: 75%; line-height: 0; position: relative; } :root sub, :root sup { vertical-align: baseline; /* for ie9 and other modern browsers */ } sup { top: -0.5em; } sub { bottom: -0.25em; } /* 让链接在 hover 状态下显示下划线 */ a { color: #1abc9c; } a:hover { text-decoration: underline; } .typo a { border-bottom: 1px solid #1abc9c; } .typo a:hover { border-bottom-color: #555; color: #555; text-decoration: none; } /* 默认不显示下划线，保持页面简洁 */ ins, a { text-decoration: none; } /* 专名号：虽然 u 已经重回 html5 Draft，但在所有浏览器中都是可以使用的， * 要做到更好，向后兼容的话，添加 class="typo-u" 来显示专名号 * 关于 标签：http://www.whatwg.org/specs/web-apps/current-work/multipage/text-level-semantics.html#the-u-element * 被放弃的是 4，之前一直搞错 http://www.w3.org/TR/html401/appendix/changes.html#idx-deprecated * 一篇关于 标签的很好文章：http://html5doctor.com/u-element/ */ u{ text-decoration: underline; } /* 标记，类似于手写的荧光笔的作用 */ mark { background: #fffdd1; border-bottom: 1px solid #ffedce; padding: 2px; margin: 0 5px; } /* 代码片断 */ pre, code, pre tt { font-family: Courier, 'Courier New', monospace; } pre { background: #f8f8f8; border: 1px solid #ddd; padding: 1em 1.5em; display: block; -webkit-overflow-scrolling: touch; } /* 一致化 horizontal rule */ hr { border: none; border-bottom: 1px solid #cfcfcf; margin-bottom: 0.8em; height: 10px; } /* 底部印刷体、版本等标记 */ small, .typo-small, /* 图片说明 */ figcaption { font-size: 0.9em; color: #888; } strong, b { font-weight: bold; color: #000; } /* 可拖动文件添加拖动手势 */ [draggable] { cursor: move; } .clearfix:before, .clearfix:after { content: ""; display: table; } .clearfix:after { clear: both; } .clearfix { zoom: 1; } .bt-container { padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; } @media (min-width: 768px) { .bt-container { width: 750px; } } @media (min-width: 992px) { .bt-container { width: 970px; } } @media (min-width: 1200px) { .bt-container { width: 1170px; } } .bt-row { margin-right: -15px; margin-left: -15px; } .bt-container:before, .bt-container:after, .bt-row:before, .bt-row:after{ display: table; content: " "; clear: both; } .bt-col-xs-1, .bt-col-sm-1, .bt-col-md-1, .bt-col-lg-1, .bt-col-xs-2, .bt-col-sm-2, .bt-col-md-2, .bt-col-lg-2, .bt-col-xs-3, .bt-col-sm-3, .bt-col-md-3, .bt-col-lg-3, .bt-col-xs-4, .bt-col-sm-4, .bt-col-md-4, .bt-col-lg-4, .bt-col-xs-5, .bt-col-sm-5, .bt-col-md-5, .bt-col-lg-5, .bt-col-xs-6, .bt-col-sm-6, .bt-col-md-6, .bt-col-lg-6, .bt-col-xs-7, .bt-col-sm-7, .bt-col-md-7, .bt-col-lg-7, .bt-col-xs-8, .bt-col-sm-8, .bt-col-md-8, .bt-col-lg-8, .bt-col-xs-9, .bt-col-sm-9, .bt-col-md-9, .bt-col-lg-9, .bt-col-xs-10, .bt-col-sm-10, .bt-col-md-10, .bt-col-lg-10, .bt-col-xs-11, .bt-col-sm-11, .bt-col-md-11, .bt-col-lg-11, .bt-col-xs-12, .bt-col-sm-12, .bt-col-md-12, .bt-col-lg-12 { position: relative; min-height: 1px; padding-right: 15px; padding-left: 15px; } .bt-col-xs-1, .bt-col-xs-2, .bt-col-xs-3, .bt-col-xs-4, .bt-col-xs-5, .bt-col-xs-6, .bt-col-xs-7, .bt-col-xs-8, .bt-col-xs-9, .bt-col-xs-10, .bt-col-xs-11, .bt-col-xs-12 { float: left; } .bt-col-xs-12 { width: 100%; } .bt-col-xs-11 { width: 91.66666667%; } .bt-col-xs-10 { width: 83.33333333%; } .bt-col-xs-9 { width: 75%; } .bt-col-xs-8 { width: 66.66666667%; } .bt-col-xs-7 { width: 58.33333333%; } .bt-col-xs-6 { width: 50%; } .bt-col-xs-5 { width: 41.66666667%; } .bt-col-xs-4 { width: 33.33333333%; } .bt-col-xs-3 { width: 25%; } .bt-col-xs-2 { width: 16.66666667%; } .bt-col-xs-1 { width: 8.33333333%; } .bt-col-xs-offset-12 { margin-left: 100%; } .bt-col-xs-offset-11 { margin-left: 91.66666667%; } .bt-col-xs-offset-10 { margin-left: 83.33333333%; } .bt-col-xs-offset-9 { margin-left: 75%; } .bt-col-xs-offset-8 { margin-left: 66.66666667%; } .bt-col-xs-offset-7 { margin-left: 58.33333333%; } .bt-col-xs-offset-6 { margin-left: 50%; } .bt-col-xs-offset-5 { margin-left: 41.66666667%; } .bt-col-xs-offset-4 { margin-left: 33.33333333%; } .bt-col-xs-offset-3 { margin-left: 25%; } .bt-col-xs-offset-2 { margin-left: 16.66666667%; } .bt-col-xs-offset-1 { margin-left: 8.33333333%; } .bt-col-xs-offset-0 { margin-left: 0; } @media (min-width: 768px) { .bt-col-sm-1, .bt-col-sm-2, .bt-col-sm-3, .bt-col-sm-4, .bt-col-sm-5, .bt-col-sm-6, .bt-col-sm-7, .bt-col-sm-8, .bt-col-sm-9, .bt-col-sm-10, .bt-col-sm-11, .bt-col-sm-12 { float: left; } .bt-col-sm-12 { width: 100%; } .bt-col-sm-11 { width: 91.66666667%; } .bt-col-sm-10 { width: 83.33333333%; } .bt-col-sm-9 { width: 75%; } .bt-col-sm-8 { width: 66.66666667%; } .bt-col-sm-7 { width: 58.33333333%; } .bt-col-sm-6 { width: 50%; } .bt-col-sm-5 { width: 41.66666667%; } .bt-col-sm-4 { width: 33.33333333%; } .bt-col-sm-3 { width: 25%; } .bt-col-sm-2 { width: 16.66666667%; } .bt-col-sm-1 { width: 8.33333333%; } .bt-col-sm-offset-12 { margin-left: 100%; } .bt-col-sm-offset-11 { margin-left: 91.66666667%; } .bt-col-sm-offset-10 { margin-left: 83.33333333%; } .bt-col-sm-offset-9 { margin-left: 75%; } .bt-col-sm-offset-8 { margin-left: 66.66666667%; } .bt-col-sm-offset-7 { margin-left: 58.33333333%; } .bt-col-sm-offset-6 { margin-left: 50%; } .bt-col-sm-offset-5 { margin-left: 41.66666667%; } .bt-col-sm-offset-4 { margin-left: 33.33333333%; } .bt-col-sm-offset-3 { margin-left: 25%; } .bt-col-sm-offset-2 { margin-left: 16.66666667%; } .bt-col-sm-offset-1 { margin-left: 8.33333333%; } .bt-col-sm-offset-0 { margin-left: 0; } } @media (min-width: 992px) { .bt-col-md-1, .bt-col-md-2, .bt-col-md-3, .bt-col-md-4, .bt-col-md-5, .bt-col-md-6, .bt-col-md-7, .bt-col-md-8, .bt-col-md-9, .bt-col-md-10, .bt-col-md-11, .bt-col-md-12 { float: left; } .bt-col-md-12 { width: 100%; } .bt-col-md-11 { width: 91.66666667%; } .bt-col-md-10 { width: 83.33333333%; } .bt-col-md-9 { width: 75%; } .bt-col-md-8 { width: 66.66666667%; } .bt-col-md-7 { width: 58.33333333%; } .bt-col-md-6 { width: 50%; } .bt-col-md-5 { width: 41.66666667%; } .bt-col-md-4 { width: 33.33333333%; } .bt-col-md-3 { width: 25%; } .bt-col-md-2 { width: 16.66666667%; } .bt-col-md-1 { width: 8.33333333%; } .bt-col-md-offset-12 { margin-left: 100%; } .bt-col-md-offset-11 { margin-left: 91.66666667%; } .bt-col-md-offset-10 { margin-left: 83.33333333%; } .bt-col-md-offset-9 { margin-left: 75%; } .bt-col-md-offset-8 { margin-left: 66.66666667%; } .bt-col-md-offset-7 { margin-left: 58.33333333%; } .bt-col-md-offset-6 { margin-left: 50%; } .bt-col-md-offset-5 { margin-left: 41.66666667%; } .bt-col-md-offset-4 { margin-left: 33.33333333%; } .bt-col-md-offset-3 { margin-left: 25%; } .bt-col-md-offset-2 { margin-left: 16.66666667%; } .bt-col-md-offset-1 { margin-left: 8.33333333%; } .bt-col-md-offset-0 { margin-left: 0; } } @media (min-width: 1200px) { .bt-col-lg-1, .bt-col-lg-2, .bt-col-lg-3, .bt-col-lg-4, .bt-col-lg-5, .bt-col-lg-6, .bt-col-lg-7, .bt-col-lg-8, .bt-col-lg-9, .bt-col-lg-10, .bt-col-lg-11, .bt-col-lg-12 { float: left; } .bt-col-lg-12 { width: 100%; } .bt-col-lg-11 { width: 91.66666667%; } .bt-col-lg-10 { width: 83.33333333%; } .bt-col-lg-9 { width: 75%; } .bt-col-lg-8 { width: 66.66666667%; } .bt-col-lg-7 { width: 58.33333333%; } .bt-col-lg-6 { width: 50%; } .bt-col-lg-5 { width: 41.66666667%; } .bt-col-lg-4 { width: 33.33333333%; } .bt-col-lg-3 { width: 25%; } .bt-col-lg-2 { width: 16.66666667%; } .bt-col-lg-1 { width: 8.33333333%; } .bt-col-lg-offset-12 { margin-left: 100%; } .bt-col-lg-offset-11 { margin-left: 91.66666667%; } .bt-col-lg-offset-10 { margin-left: 83.33333333%; } .bt-col-lg-offset-9 { margin-left: 75%; } .bt-col-lg-offset-8 { margin-left: 66.66666667%; } .bt-col-lg-offset-7 { margin-left: 58.33333333%; } .bt-col-lg-offset-6 { margin-left: 50%; } .bt-col-lg-offset-5 { margin-left: 41.66666667%; } .bt-col-lg-offset-4 { margin-left: 33.33333333%; } .bt-col-lg-offset-3 { margin-left: 25%; } .bt-col-lg-offset-2 { margin-left: 16.66666667%; } .bt-col-lg-offset-1 { margin-left: 8.33333333%; } .bt-col-lg-offset-0 { margin-left: 0; } }