@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 PingFang SC, Lantinghei SC, 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: #333; } a:hover { text-decoration: none; } .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, .typo-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: 2px; } /* 底部印刷体、版本等标记 */ 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; } /* 强制文本换行 */ .textwrap, .textwrap td, .textwrap th { word-wrap: break-word; word-break: break-all; } .textwrap-table { table-layout: fixed; } /* 提供 serif 版本的字体设置: iOS 下中文自动 fallback 到 sans-serif */ .serif { font-family: Palatino, Optima, Georgia, serif; } /* 保证块/段落之间的空白隔行 */ .typo p, .typo pre, .typo ul, .typo ol, .typo dl, .typo form, .typo hr, .typo table, .typo-p, .typo-pre, .typo-ul, .typo-ol, .typo-dl, .typo-form, .typo-hr, .typo-table, blockquote { margin-bottom: 1.2em } h1, h2, h3, h4, h5, h6 { font-family: PingFang SC, Verdana, Helvetica Neue, Microsoft Yahei, Hiragino Sans GB, Microsoft Sans Serif, WenQuanYi Micro Hei, sans-serif; font-weight: 100; color: #000; /*line-height: 1.35;*/ } /* 标题应该更贴紧内容，并与其他块区分，margin 值要相应做优化 */ .typo h1, .typo h2, .typo h3, .typo h4, .typo h5, .typo h6, .typo-h1, .typo-h2, .typo-h3, .typo-h4, .typo-h5, .typo-h6 { margin-top: 1.2em; margin-bottom: 0.6em; line-height: 1.35; } .typo h1, .typo-h1 { font-size: 2em; } .typo h2, .typo-h2 { font-size: 1.8em; } .typo h3, .typo-h3 { font-size: 1.6em; } .typo h4, .typo-h4 { font-size: 1.4em; } .typo h5, .typo h6, .typo-h5, .typo-h6 { font-size: 1.2em; } /* 在文章中，应该还原 ul 和 ol 的样式 */ .typo ul, .typo-ul { margin-left: 1.3em; list-style: disc; } .typo ol, .typo-ol { list-style: decimal; margin-left: 1.9em; } .typo li ul, .typo li ol, .typo-ul ul, .typo-ul ol, .typo-ol ul, .typo-ol ol { margin-bottom: 0.8em; margin-left: 2em; } .typo li ul, .typo-ul ul, .typo-ol ul { list-style: circle; } /* 同 ul/ol，在文章中应用 table 基本格式 */ .typo table th, .typo table td, .typo-table th, .typo-table td, .typo table caption { border: 1px solid #ddd; padding: 0.5em 1em; color: #666; } .typo table th, .typo-table th { background: #fbfbfb; } .typo table thead th, .typo-table thead th { background: #f1f1f1; } .typo table caption { border-bottom: none; } /* 去除 webkit 中 input 和 textarea 的默认样式 */ .typo-input, .typo-textarea { -webkit-appearance: none; border-radius: 0; } .typo-em, .typo em, legend, caption { color: #000; font-weight: inherit; } /* 着重号，只能在少量（少于100个字符）且全是全角字符的情况下使用 */ .typo-em { position: relative; } .typo-em:after { position: absolute; top: 0.65em; left: 0; width: 100%; overflow: hidden; white-space: nowrap; content: "・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・"; } /* Responsive images */ .typo img { max-width: 100%; } .hljs{display:block;overflow-x:auto;padding:0.5em;background:#002b36;color:#839496}.hljs-comment,.hljs-quote{color:#586e75}.hljs-keyword,.hljs-selector-tag,.hljs-addition{color:#859900}.hljs-number,.hljs-string,.hljs-meta .hljs-meta-string,.hljs-literal,.hljs-doctag,.hljs-regexp{color:#2aa198}.hljs-title,.hljs-section,.hljs-name,.hljs-selector-id,.hljs-selector-class{color:#268bd2}.hljs-attribute,.hljs-attr,.hljs-variable,.hljs-template-variable,.hljs-class .hljs-title,.hljs-type{color:#b58900}.hljs-symbol,.hljs-bullet,.hljs-subst,.hljs-meta,.hljs-meta .hljs-keyword,.hljs-selector-attr,.hljs-selector-pseudo,.hljs-link{color:#cb4b16}.hljs-built_in,.hljs-deletion{color:#dc322f}.hljs-formula{background:#073642}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:bold} /** scrollbar **/ /*::-webkit-scrollbar { width: 8px; height: 8px; } */ ::-webkit-scrollbar-track { -webkit-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3); } ::-webkit-scrollbar-thumb { -webkit-border-radius: 4px; border-radius: 4px; background: rgba(136, 136, 136, .6); -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3); } ::-webkit-scrollbar-thumb:window-inactive { background: rgba(136, 136, 136, .4); } @media only screen and (min-width: 769px) { .hide-in-large { display: none; } } @media only screen and (max-width: 768px) { .hide-in-small { display: none; } } /** wrapper **/ .wrapper { position: relative; zoom: 1; margin-right: auto; margin-left: auto; width: 1163px; } .wrapper:before, .wrapper:after { display: table; content: ''; } .wrapper:after { clear: both; } .align-left { float: left; } .align-right { float: right; } /* grid */ .grid { position: relative; zoom: 1; margin-right: auto; margin-left: auto; max-width: 100%; } .grid:before, .grid:after { display: table; content: ''; } .grid:after { clear: both; } .grid [class *="u-"] { float: left; /*background: blue;*/ } .grid [class *="u-"]:nth-child(odd) { /*background: red;*/ } .grid .u-lg-1-1 { width: 100%; } .grid .u-lg-1-3 { width: 33.3333%; } .grid .u-lg-2-3 { width: 100%; } .grid .u-lg-1-2 { width: 50%; } /* sm */ @media only screen and (max-width: 768px) { .grid .u-sm-1-1 { width: 100%; } } /** top-bar */ .top-bar { border-top: 3px solid #137de1; background: #fbfbfb; border-bottom: 1px solid #c7c7c7; line-height: 40px; } .site-header { margin-bottom: 15px; margin-top: -7px; background-color: #137de1; } .site-logo { background: url('../images/logo.png') no-repeat; text-indent: -9999em; width: 183px; height: 100px; } .site-logo a { display: block; width: 183px; height: 100px; } .site-menu { font-size: 14px; font-weight: 500; } .site-menu a { color: #fbfbfb; padding: 15px 78px; display: block; } .site-menu a:hover { color: #fff; background: red; } .site-header .site-menu { background: #137de1; overflow: hidden; } .site-header .site-menu li { float: left; } .site-header .site-menu li.hr:after { width: 1px; background: rgba(255, 255, 255, .4); content: ""; display: block; height: 15px; margin-top: 20px; } .pushy .site-menu {} .menu-btn { position: absolute; top: 15px; left: 15px; width: 40px; background: none; border: none; color: #137de1; font-weight: 500; font-size: 30px; } /** features */ .features { margin-top: 30px; margin-bottom: 30px; } .features img { display: block; width: 100%; } #modul_promo { padding-right: 30px; } #modul_album [class*="u-"]:nth-child(2) { padding-top: 15px; padding-right: 7.5px; } #modul_album [class*="u-"]:nth-child(3) { padding-top: 15px; padding-left: 7.5px; } #modul_entry { /*padding-right: 30px;*/ /*border-right: 1px solid rgba(0, 0, 0, .2);*/ } #modul_entry h3.title { border-left: 4px solid #fa8200; padding-left: 8px; padding-top: 4px; padding-bottom: 4px; font-weight: 500; margin-top: 30px; margin-bottom: 15px; } #modul_entry .grid > .u-lg-1-2 { padding-right: 30px; border-right: 1px solid rgba(0, 0, 0, .2); } #modul_entry .grid > .u-lg-1-2:last-child { padding-right: 0; padding-left: 30px; border-right: none; } #modul_entry .grid > .u-lg-1-3 { padding-right: 15px; margin-right: 15px; border-right: 1px solid rgba(0, 0, 0, .2); } #modul_entry .grid > .u-lg-1-3:last-child { border-right: none; margin-right: -30px; } #modul_sidebar { padding-left: 30px; } #modul_sidebar h3.title { border-bottom: 4px solid #fa8200; font-weight: 500; margin-bottom: 15px; display: inline-block; padding-bottom: 4px; padding-right: 30px; } .card { padding-bottom: 15px; font-size: 14px; } .card img { display: block; width: 100%; height: 200px; border: 1px solid rgba(0, 0, 0, .1); } .card:not(.horizontal) .title { border-left: 4px solid #fa8200; padding: 2px 0 2px 4px; margin-top: 8px; margin-bottom: 8px; white-space: nowrap; overflow: hidden; font-weight: 500; line-height: 24px; font-size: 14px; } .card.horizontal .title { font-weight: 700; line-height: 28px; font-size: 18px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .card:hover .title { color: #0143a6; } .card.horizontal .bd, .card.horizontal .ft { padding-left: 15px; } .card.horizontal { overflow: hidden; } .card.horizontal .hd, .card.horizontal .bd, .card.horizontal .ft { float: left; } .card.horizontal .hd { width: 30%; } .card.horizontal .bd, .card.horizontal .ft { width: 806px; } .card .meta { color: #999; margin-top: 15px; margin-right: 10px; font-size: 14px; float: right; } .site-footer { background: #19232d; color: #fbfbfb; margin-top: 30px; padding-top: 30px; padding-bottom: 60px; font-size: 14px; } .wpcf7-form { display: block; margin: 30px auto; width: 300px; max-width: 100%; } .wpcf7-form input { width: 100%; height: 40px; } .wpcf7-form input[type="submit"] { background: #fa8200; border: none; color: #fbfbfb; } .related_post_title { font-weight: 500; border-left: 4px solid #fa8200; padding: 4px 0 4px 8px; line-height: 30px; } .related_post { padding-left: 30px; padding-right: 30px; } .related_post li { margin-bottom: 8px; list-style: square; } .related_post a { border-bottom: 1px solid #009cfa; line-height: 30px; color: #009cfa; } @media only screen and (max-width: 768px) { .wrapper { width: 100%; } .site-logo { margin-left: auto; margin-right: auto; width: 140px; height: 75px; } .site-logo a { width: 140px; height: 75px; } #modul_promo { padding-right: 0; } #modul_album { margin-top: 30px; } #modul_entry, #modul_sidebar { padding-right: 15px; border-right: none; padding-left: 15px; } #modul_entry .grid > .u-lg-1-2 { padding-right: 15px; border-right: none; padding-left: 15px; } #modul_entry .grid > .u-lg-1-2:last-child { padding-right: 15px; padding-left: 15px; border-right: none; } #modul_entry .grid > .u-lg-1-3 { padding-right: 15px; margin-right: 0; border-right: none; padding-left: 15px; } } /** 鍚庡姞 */ #modul_album .grid a{ display: block; position: relative; } .home-title{ padding-left: 10px; position: absolute; bottom: 0; width: 100%; overflow: hidden; height: 30px; color:#fff; background-color: rgba(136,136,136,0.7); left: 0; } #linksBox, #contact{ width:1050px; margin-left: auto; margin-right: auto; } #linksBox li{ list-style:none; } #linksBox li .blogroll li{ display:inline-block; margin-left:10px; margin-right:10px; } #linksBox li .blogroll img{ width:160px; height:70px; } #linkcat-80 h2{ margin-bottom:10px; } #linksBox #linkcat-81{ margin-top:20px; } /**/ #contact .content{ margin-left:30px; } #contact .content dl{ margin-bottom: 50px; } #contact .content dt{ margin-bottom: 10px; } #contact .content dd{ margin-left:20px; } @media screen and (max-width: 500px){ .u-lg-2-3 .link{ margin-top:20px; } } @media screen and (min-width: 1050px){ .site-footer .wrapper .grid [class *="u-"] { width:100%; } .site-footer .wrapper .grid .u-lg-1-3 .about{ display:inline-block; margin-left:20px; margin-right:20px; } .u-lg-2-3 .link{ margin-top:20px; margin-left:20px; } } @media screen and (max-width: 1050px){ #linksBox, #contact{ width:100%; } } /** 淇敼鎻掍欢 */ .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { bottom: 30px; left: 0; width: 100%; } /** post */ .entry img { display: block; max-width: 100%; margin: 15px auto; height: auto; border: 1px solid rgba(0, 0, 0, .1); } .post .post-meta .bdsharebuttonbox{ margin-bottom: 20px; margin-top: 20px; } /*瓒ｈ叮娓告垙椤甸潰*/ .ququ-banner{ width: 100%; } .ququ-banner .banner-img{ width: 100%; } .ququ-centent{ padding-left:6px; padding-right:6px; } .ququ-centent h1{ text-align: center; margin-top: 1.2em; margin-bottom: 0.6em; line-height: 1.35; } .ququ-centent strong{ } .ququ-centent h1, .ququ-centent h2, .ququ-centent h3, .ququ-centent h4, .ququ-centent h5, .ququ-centent h6{ margin-top: 2.2em; margin-bottom: 2.6em; line-height: 1.35; } .ququ-centent h6{ font-size: 1.2em; text-align: center; margin-top: 3em; } .ququ-banner .maximg{ max-width:1000px; margin-left:auto; margin-right: auto; display: block; } #ququ .cebian{ position: fixed; top: 140px; right: 0; } #ququ .cebian a{ display: block; } @media screen and (max-width: 560px){ .ququ-centent h1, .ququ-centent h2, .ququ-centent h3, .ququ-centent h4, .ququ-centent h5, .ququ-centent h6{ margin-top: 1.6em; margin-bottom: 1.6em; line-height: 1.35; } .ququ-centent h6{ margin-top: 2em; font-size: 13px; } .ququ-banner .maximg{ margin-top: 3.2em; } }