@charset "utf-8";
/* -----------非响应式前端框架-------------
* 版本号 v1.0
* Created & Modified by Desen
* Date modified 2019.10.23
* Licensed under MIT license.
* http://opensource.org/licenses/MIT
*/
/*
目录结构
1. 重定义浏览器默认样式
2. 格栅系统
3. 基础CSS
3.1 排版
3.1.1 标题
3.1.2 段落
3.1.3 强调
3.1.4 对齐
3.1.4 定位
3.1.5 浮动
3.1.6 文字单行溢出省略号
3.1.7 水平线
3.1.8 外边距
3.1.9 内填充
3.1.10 边框 边框颜色 圆角
3.1.11 阴影
3.1.12 行内分割竖线
3.1.13 文字尺寸
3.1.14 文字行距
3.1.15 文字颜色
3.1.16 缩略语
3.1.17 地址
3.1.18 引用
3.1.19 上标 下标
3.1.20 列表
3.1.21 描述
3.1.22 隐藏 显示
*/
/*1 重定义浏览器默认样式
Name: style_reset
Explain: 重定义浏览器默认样式
*/
html {
font-family: sans-serif;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}
body {
font:14px/1.5 "\5FAE\8F6F\96C5\9ED1","\5b8b\4f53";
}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,hr,p,pre,form,fieldset,input,button,legend,textarea,blockquote,th,td {
margin:0;
padding:0;
}
table {
border-collapse:collapse;
border-spacing:0;
}
td,th {
padding: 0;
}
caption,th {
text-align: center;
}
h1,h2,h3,h4,h5,h6 {
font-size:100%;
}
address,cite,code,em,dfn,var,th,i,b {
font-style:normal;
font-weight:normal;
}
fieldset,img {
border:0;
}
ol,ul {
list-style:none;
}
li {
list-style-type:none;
}
a {
text-decoration:none;
cursor: pointer;
}
a:hover,a:visited,a:link,a:active {
text-decoration:underline;
outline:none;
}
/*清除浮动
Name: style_clearfix
Example: class="clearfix|cl"
Explain: clearfix（简写cl）避免因子元素浮动而导致的父元素高度缺失能问题
*/
.cl:after,.clearfix:after {
content:"\20";
display:block;
height:0;
clear:both;
visibility:hidden;
}
.cl,.clearfix {
zoom:1;
}
/*2栅格系统
Name: style_container
Example:
Explain: 栅格系统
*/
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
*:before,
*:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}/*上述代码是把所有元素的盒模型都设置为了boeder-box*/
.container {
width: 1170px;
/*max-width: none !important;*/
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
}
.row.cl{}
.row {
box-sizing:border-box;
margin-right: -15px;
margin-left: -15px;
}
.row:before,
.row:after {
display: table;
content: " ";
}
.row:before,
.row:after {
clear: both;
}/*用于清除浮动*/
.col-x1, .col-x2, .col-x3, .col-x4, .col-x5, .col-x6, .col-x7, .col-x8, .col-x9, .col-x10, .col-x11, .col-x12 {
position: relative;
min-height: 1px;
padding-right: 15px;
padding-left: 15px;
box-sizing:border-box;
-webkit-transition:all 0.3s ease-in;
-moz-transition:all 0.3s ease-in;
-o-transition:all 0.3s ease-in;
transition:all 0.3s ease-in;
float: left;
}
.col-x12 {
width: 100%;
}
.col-x11 {
width: 91.66666667%;
}
.col-x10 {
width: 83.33333333%;
}
.col-x9 {
width: 75%;
}
.col-x8 {
width: 66.66666667%;
}
.col-x7 {
width: 58.33333333%;
}
.col-x6 {
width: 50%;
}
.col-x5 {
width: 41.66666667%;
}
.col-x4 {
width: 33.33333333%;
}
.col-x3 {
width: 25%;
}
.col-x2 {
width: 16.66666667%;
}
.col-x1 {
width: 8.33333333%;
}
.col-x-pull-12 {
right: 100%;
}
.col-x-pull-11 {
right: 91.66666667%;
}
.col-x-pull-10 {
right: 83.33333333%;
}
.col-x-pull-9 {
right: 75%;
}
.col-x-pull-8 {
right: 66.66666667%;
}
.col-x-pull-7 {
right: 58.33333333%;
}
.col-x-pull-6 {
right: 50%;
}
.col-x-pull-5 {
right: 41.66666667%;
}
.col-x-pull-4 {
right: 33.33333333%;
}
.col-x-pull-3 {
right: 25%;
}
.col-x-pull-2 {
right: 16.66666667%;
}
.col-x-pull-1 {
right: 8.33333333%;
}
.col-x-pull-0 {
right: auto;
}
.col-x-push-12 {
left: 100%;
}
.col-x-push-11 {
left: 91.66666667%;
}
.col-x-push-10 {
left: 83.33333333%;
}
.col-x-push-9 {
left: 75%;
}
.col-x-push-8 {
left: 66.66666667%;
}
.col-x-push-7 {
left: 58.33333333%;
}
.col-x-push-6 {
left: 50%;
}
.col-x-push-5 {
left: 41.66666667%;
}
.col-x-push-4 {
left: 33.33333333%;
}
.col-x-push-3 {
left: 25%;
}
.col-x-push-2 {
left: 16.66666667%;
}
.col-x-push-1 {
left: 8.33333333%;
}
.col-x-push-0 {
left: auto;
}
.col-x-offset-12 {
margin-left: 100%;
}
.col-x-offset-11 {
margin-left: 91.66666667%;
}
.col-x-offset-10 {
margin-left: 83.33333333%;
}
.col-x-offset-9 {
margin-left: 75%;
}
.col-x-offset-8 {
margin-left: 66.66666667%;
}
.col-x-offset-7 {
margin-left: 58.33333333%;
}
.col-x-offset-6 {
margin-left: 50%;
}
.col-x-offset-5 {
margin-left: 41.66666667%;
}
.col-x-offset-4 {
margin-left: 33.33333333%;
}
.col-x-offset-3 {
margin-left: 25%;
}
.col-x-offset-2 {
margin-left: 16.66666667%;
}
.col-x-offset-1 {
margin-left: 8.33333333%;
}
.col-x-offset-0 {
margin-left: 0;
}
/*3.0 基础样式*/
/*3.1 排版*/
/*3.1.1 标题
Example：
h1. 大标题小标题
h2. 大标题小标题
h3. 大标题小标题
h4. 大标题小标题
h5. 大标题小标题
h6. 大标题小标题
*/
h1,h2,h3,h4,h5,h6 {
font-weight:500;
line-height:1.1;
color:inherit;
}
h1 small,h2 small,h3 small,h4 small,h5 small,h6 small,h1 .small,h2 .small,h3 .small,h4 .small,h5 .small,h6 .small {
font-weight:400;
line-height:1;
color:#999;
}
h1,h2,h3 {
padding-top:20px;
padding-bottom:10px;
}
h1 small,h2 small,h3 small,h1 .small,h2 .small,h3 .small {
font-size:65%;
}
h4,h5,h6 {
margin-top:10px;
margin-bottom:10px;
}
h4 small,h5 small,h6 small,h4 .small,h5 .small,h6 .small {
font-size:75%;
}
h1 {
font-size:36px;
}
h2 {
font-size:30px;
}
h3 {
font-size:24px;
}
h4 {
font-size:18px;
}
h5 {
font-size:14px;
}
h6 {
font-size:12px;
}
/*3.1.2 段落
Example:
这是段落，向下10像素间距
段落突出显示
段落缩进2个字符
*/
p {
margin: 0 0 10px;
line-height: 1.8;
}
.lead {
margin-bottom: 20px;
font-size: 16px;
font-weight: 300;
line-height: 1.4;
}
.text-indent {
text-indent:2em;
}
/*3.1.3 强调
Example:
小型文本，是父容器字体大小的85%
重要文本，加粗显示
被强调的文本，斜体显示
带下划线的文本
引用
突出显示文本
带删除线的文本
*/
small {
font-size:85%;
}
b,strong {
font-weight: bold;
}
em {
font-style:italic;
}
i{} /*斜体*/
u{} /*加下划线*/
cite {
font-style:normal;
}
mark {
color:#000;
background:#ff0;
}
del{} /*删除线*/
.text-uppercase {
text-transform:uppercase;
} /*文字大写*/
.text-lowercase {
text-transform:lowercase;
} /*文字小写*/
.text-capitalize {
text-transform:capitalize;
} /*首字母大写*/
.en {
font-family:Arial!important;
}
/*3.1.4 对齐
Name: style_text-align
Example: class="text-left|text-right|text-center|va-t|va-m|va-b"
Explain: .text-水平对齐 （.text-left左对齐|.text-right右对齐|.text-center居中对齐|.text-justify段落中超出屏幕部分文字自动换行|.text-nowrap段落中超出屏幕部分不换行）
.va-上下对齐 （.va-t 居上对齐|.va-m 居中对齐|.va-b 居下对齐）
*/
.text-left {
text-align: left;
}
.text-right {
text-align: right;
}
.text-center {
text-align: center;
}
.text-justify {
text-align: justify;
}
.text-nowrap {
white-space: nowrap;
}
.va-t {
vertical-align:top!important;
}
.va-m {
vertical-align:middle!important;
}
.va-b {
vertical-align:bottom!important;
}
/*3.1.5 浮动
Name: style_float
Example: class="float-left|float-right|clearfix"
Explain: .float-left 左浮动|.float-right 右浮动|.clearfix 清除浮动
*/
.float-left {
float:left!important;
_display:inline;
}
.float-right {
float:right!important;
_display:inline;
}
.clearfix:before,.clearfix:after {
display: table;
content: " ";
}
.clearfix:after {
clear: both;
}
/*3.1.6 文字单行溢出省略号
Name: style_text-overflow
Example: class="text-overflow"
*/
.text-overflow {
overflow:hidden;/*内容超出后隐藏*/
text-overflow:ellipsis;/*超出内容显示为省略号*/
white-space:nowrap;/*文本不进行换行*/
}
/*3.1.7 水平线
Name: style_line
Example: class="line"
*/
.line {
font-size:0;
line-height:0;
border-top: solid 1px #eee;
float: none;
}
/*3.1.8 外边距
Name: style_margin
Example: class="margin-top-5|margin-top-10..."
Explain: .margin-top表示上边距|.margin-bottom表示下边距|.margin-left表示左边距|.margin-right表示右边距
*/
.margin-top-5 {
margin-top:5px;
}
.margin-top-10 {
margin-top:10px;
}
.margin-top-15 {
margin-top:15px;
}
.margin-top-20 {
margin-top:20px;
}
.margin-top-25 {
margin-top:25px;
}
.margin-top-30 {
margin-top:30px;
}
.margin-top-35 {
margin-top:35px;
}
.margin-top-40 {
margin-top:40px;
}
.margin-top-50 {
margin-top:50px;
}
.margin-bottom-5 {
margin-bottom:5px;
}
.margin-bottom-10 {
margin-bottom:10px;
}
.margin-bottom-15 {
margin-bottom:15px;
}
.margin-bottom-20 {
margin-bottom:20px;
}
.margin-bottom-30 {
margin-bottom:30px;
}
.margin-bottom-40 {
margin-bottom:40px;
}
.margin-bottom-50 {
margin-bottom:50px;
}
.margin-left-5 {
margin-left:5px;
}
.margin-left-10 {
margin-left:10px;
}
.margin-left-15 {
margin-left:15px;
}
.margin-left-20 {
margin-left:20px;
}
.margin-left-30 {
margin-left:30px;
}
.margin-left-40 {
margin-left:40px;
}
.margin-left-50 {
margin-left:50px;
}
.margin-right-5 {
margin-right:5px;
}
.margin-right-10 {
margin-right:10px;
}
.margin-right-15 {
margin-right:15px;
}
.margin-right-20 {
margin-right:20px;
}
.margin-right-30 {
margin-right:30px;
}
.margin-right-40 {
margin-right:40px;
}
.margin-right-50 {
margin-right:50px;
}
/*3.1.9 内填充
Name: style_padding
Example: class="padding-top-5|padding-top-10|……"
Explain: .padding-top表示上填充|.padding-bottom表示下填充|.padding-left表示左填充|.padding-right表示右填充
*/
.padding-top-5 {
padding-top:5px;
}
.padding-top-10 {
padding-top:10px;
}
.padding-top-15 {
padding-top:15px;
}
.padding-top-20 {
padding-top:20px;
}
.padding-top-25 {
padding-top:25px;
}
.padding-top-30 {
padding-top:30px;
}
.padding-bottom-5 {
padding-bottom:5px;
}
.padding-bottom-10 {
padding-bottom:10px;
}
.padding-bottom-15 {
padding-bottom:15px;
}
.padding-bottom-20 {
padding-bottom:20px;
}
.padding-bottom-25 {
padding-bottom:25px;
}
.padding-bottom-30 {
padding-bottom:30px;
}
.padding-left-5 {
padding-left:5px;
}
.padding-left-10 {
padding-left:10px;
}
.padding-left-15 {
padding-left:15px;
}
.padding-left-20 {
padding-left:20px;
}
.padding-left-25 {
padding-left:25px;
}
.padding-left-30 {
padding-left:30px;
}
.padding-right-5 {
padding-right:5px;
}
.padding-right-10 {
padding-right:10px;
}
.padding-right-15 {
padding-right:15px;
}
.padding-right-20 {
padding-right:20px;
}
.padding-right-25 {
padding-right:25px;
}
.padding-right-30 {
padding-right:30px;
}
.padding-5 {
padding:5px;
}
.padding-10 {
padding:10px;
}
.padding-15 {
padding:15px;
}
.padding-20 {
padding:20px;
}
.padding-25 {
padding:25px;
}
.padding-30 {
padding:30px;
}
.padding-40 {
padding:40px;
}
/*3.1.10 边框，边框颜色，圆角
Name: style-border
Example: class="bk_gray radius"
Explain: .bk_gray 边框|radius 圆角|round 椭圆 | circle 圆形
*/
.border-primary {
background-color:#5a98de;
}/*边框主要颜色*/
.border-secondary {
background-color:#555;
}/*次主色*/
.border-color-333 {
background-color:#333;
}/*辅助色浅黑*/
.border-color-666 {
background-color:#666;
}/*辅助色灰色*/
.border-color-999 {
background-color:#999;
}/*辅助色浅灰*/
.border-success {
background-color:#5eb95e;
}
.border-danger {
background-color:#dd514c;
}
.border-warning {
background-color:#f37b1d;
}
.border-error {
background-color:#c00;
}
.border-red {
background-color:red;
}
border-green {
background-color:green;
}
border-blue {
background-color:blue;
}
border-orange {
background-color:orange;
}
border-white {
background-color:white;
}
.bk-gray {
border:solid 1px #eee;
}
.radius {
border-radius:4px;
}
.size-MINI.radius {
border-radius:3px;
}
.size-L.radius {
border-radius:5px;
}
.size-XL.radius {
border-radius:6px;
}
.round {
border-radius:1000px;
overflow:hidden;
}
.circle {
border-radius:50%;
overflow:hidden;
}
/*3.1.11 阴影
Name: style_shadow
Example: class="box_shadow|text-shadow"
Explain: box_shadow 块级元素阴影，全局样式，可用在表格，文本框，文本域，div等块级元素上。
text-shadow 文字阴影
*/
.box-shadow-none {
-webkit-box-shadow:0 0 0 rgba(0,0,0,0.5);
box-shadow:0 0 0 rgba(0,0,0,0.5);
}
.box-shadow-2 {
-webkit-box-shadow:0 3px 5px rgba(0,0,0,0.5);
box-shadow:0 3px 5px rgba(0,0,0,0.5);
}
.box-shadow-4 {
-webkit-box-shadow:0 3px 9px rgba(0,0,0,0.5);
box-shadow:0 3px 9px rgba(0,0,0,0.5);
}
.box-shadow-6 {
-webkit-box-shadow:0 6px 9px rgba(0,0,0,0.5);
box-shadow:0 6px 9px rgba(0,0,0,0.5);
}
.text-shadow {
-webkit-text-shadow:0 0 2px rgba(0,0,0,0.2);
text-shadow:0 0 2px rgba(0,0,0,0.2);
}
/*3.1.12 行内分割竖线
Name: style_pipe
Example: |
*/
.pipe {
margin:0 10px;
color:#CCC;
font-size:14px!important;
}
/*3.1.13 文字尺寸
Name: style_font-size
Example: class="font-12|font-14|font-16|font-18|font-20|font-24|font-26|font-28|font-30"
Explain: 12px字体|14px字体|16px字体|18px字体|20px字体|24px字体|26px字体|28px字体|30px字体
*/
.font-12 {
font-size:12px;
}
.font-14 {
font-size:14px;
}
.font-16 {
font-size:16px;
}
.font-18 {
font-size:18px;
}
.font-20 {
font-size:20px;
}
.font-22 {
font-size: 22px;
}
.font-24 {
font-size:24px;
}
.font-26 {
font-size:26px;
}
.font-28 {
font-size:28px;
}
.font-30 {
font-size:30px;
}
/*3.1.14 文字行距
Name: mod_line-height
Example: class="lh-16|lh-18|lh-20|lh-22|lh-24|lh-26|lh-28|lh-30"
Explain: 16px行高|18px行高|20px行高|22px行高|24px行高|26px行高|30px行高
*/
.lh-16 {
line-height:16px;
}
.lh-18 {
line-height:18px;
}
.lh-20 {
line-height:20px;
}
.lh-22 {
line-height:22px;
}
.lh-24 {
line-height:24px;
}
.lh-26 {
line-height:26px;
}
.lh-28 {
line-height:28px;
}
.lh-30 {
line-height:30px;
}
/*3.1.15 文字颜色
Name: style_color
Example: class="c-primary|c-sub|c-success|c-danger|c-warning|c-333|c-666|c-999|c-red|c-green|c-blue|c-white|c-black|c-orange"
Explain: 主要颜色|次主色|强调色—成功|强调色—危险|强调色—警告色|强调色—错误色|次主色—浅黑|辅助色—灰色|标准色—红色|标准色—绿色|标准色—蓝色|标准色—白色|标准色—黑色|标准色—橙色
*/
/*全局默认链接颜色*/
body {
background-color:#fff;
color:#333;
}
.bg-fff {
background-color:#fff;
}
a {
color:#333;
}
a:hover,.active a {
color:#06c;
}
/*主要颜色*/
.c-primary,.c-primary a,a.c-primary {
color:#5a98de;
}
.c-primary a:hover,a.c-primary:hover {
color:#5a98de;
}
/*次主色*/
.c-secondary,.c-secondary a,a.c-secondary {
color:#555;
}
.c-secondary a:hover,a.c-secondary:hover {
color:#555;
}
/*强调色—成功*/
.c-success,.c-success a,a.c-success {
color:#5eb95e;
}
.c-success a:hover,a.c-success:hover {
color:#5eb95e;
}
/*强调色—危险*/
.c-danger,.c-danger a,a.c-danger {
color:#dd514c;
}
.c-danger a:hover,a.c-danger:hover {
color:#dd514c;
}
/*强调色—警告*/
.c-warning,.c-warning a,a.c-warning {
color:#f37b1d;
}
.c-warning a:hover,a.c-warning:hover {
color:#f37b1d;
}
/*强调色—错误*/
.c-error,.c-error a,a.c-error {
color:#c00;
}
.c-error a:hover,a.c-error:hover {
color:#c00;
}
/*辅助色—浅黑*/
.c-333,.c-333 a,a.c-333 {
color:#333;
}
.c-333 a:hover,a.c-333:hover {
color:#333;
}
/*辅助色—灰色*/
.c-666,.c-666 a,a.c-666 {
color:#666;
}
.c-666 a:hover,a.c-666:hover {
color:#666;
}
.c-999,.c-999 a,a.c-999 {
color:#999;
}
.c-999 a:hover,a.c-999:hover {
color:#999;
}
/*标准色—红色*/
.c-red,.c-red a,a.c-red {
color:red;
}
.c-red a:hover,a.c-red:hover {
color:red;
}
/*标准色—绿色*/
.c-green,.c-green a,a.c-green {
color:green;
}
.c-red a:hover,a.c-red:hover {
color:green;
}
/*标准色—蓝色*/
.c-blue,.c-blue a,a.c-blue {
color:blue;
}
.c-blue a:hover,a.c-blue:hover {
color:blue;
}
/*标准色—白色*/
.c-white,.c-white a,a.c-white {
color:white;
}
.c-white a:hover,a.c-white:hover {
color:white;
}
/*标准色—黑色*/
.c-black,.c-black a {
color:black;
}
.c-black a:hover,a.c-black:hover {
color:black;
}
/*标准色—橙色*/
.c-orange,.c-orange a,a.c-orange {
color:orange;
}
.c-orange a:hover,a.c-orange:hover {
color:orange;
}
/*3.1.16 缩略语
Example: UI
Explain:
*/
abbr[title],abbr[data-original-title] {
cursor:help;
border-bottom:1px dotted #999;
}
abbr.initialism {
font-size:90%;
text-transform:uppercase;
}
/*3.1.17 地址
Example: 北京市海淀区上地……
Explain:
*/
address {
display:block;
margin-bottom:20px;
font-style:normal;
line-height:20px;
}
/*3.1.18 引用
Example: 这是引用的内容
Explain:
*/
blockquote {
padding:0 0 0 15px;
margin:0 0 20px;
border-left:5px solid #eee;
}
blockquote p {
margin-bottom:0;
font-size:17.5px;
font-weight:300;
line-height:1.25;
}
blockquote small {
display:block;
line-height:20px;
color:#999;
}
blockquote small:before {
content:'\2014 \00A0';
}
blockquote.text-r {
padding-right:15px;
padding-left:0;
border-right:5px solid #eee;
border-left:0;
}
blockquote.text-r p,blockquote.text-r small {
text-align:right;
}
blockquote.text-r small:before {
content:'';
}
blockquote.text-r small:after {
content:'\00A0 \2014';
}
q:before,q:after,blockquote:before,blockquote:after {
content:"";
}
q {
quotes: "\201C" "\201D" "\2018" "\2019";
}/*短的引用*/
/*3.1.19 上标，下标
Example: 2 2
Explain: 上标|下标
*/
sub,sup {
position:relative;
font-size:75%;
line-height:0;
vertical-align:baseline;
}
sup {
top:-0.5em;
}
sub {
bottom:-0.25em;
}
/*3.1.20 列表
Name: style_ulolli
Example:
- 无序列表
- 无序列表
- 无序列表
Explain:
*/
ul.unstyled,ol.unstyled {
margin-left:0;
list-style:none;
}
ul.inline,ol.inline {
margin-left:0;
list-style:none;
}
ul.inline > li,ol.inline > li {
display:inline-block;
*display:inline;
padding-right:5px;
padding-left:5px;*zoom:1;
}
.list-view > .item {
padding:10px;
position:relative;
overflow:hidden;
}/*禁止换行*/
.list-view > .item .date {
font-size:12px;
font-family:Arial;
color:#999;
}
/*排行榜*/
/*- 1排行榜列表12
*/
.list-top > .item {
padding-left: 30px;
}
.list-top > .item .num {
position:absolute;
top:11px;
display:block;
width:20px;
height:20px;
color:#fff;
background-color:#5a98de;
text-align:center;
}
/*3.1.21 描述
Name: style_dldtdd
Example: - H-ui
- 基于Bootstrap框架的改进扩展的前端框架
Explain: .dl-horizontal 水平描述，默认不加为垂直模式。
*/
.dl-horizontal.cl{}
.dl-horizontal dt {
float:left;width:160px;
overflow:hidden;
clear:left;
text-align:right;
text-overflow:ellipsis;
white-space:nowrap;
}
.dl-horizontal dd {
margin-left:180px;
}
/*3.1.22 隐藏 显示
Name: style_display
Example: 隐藏的内容
显示的内容
Explain: .hide 隐藏 / .show 显示
*/
.hide {
display:none;
}
[hidden] {
display: none;
}
.hidden {
display:none!important;
visibility:hidden!important;
}
.f-hide {
font:0/0 a;
color:transparent;
text-shadow:none;
background-color:transparent;
border:0;
}
[class*="span"].hide,.row-fluid [class*="span"].hide {
display:none;
}
.show {
display:block;
}
.invisible {
visibility:hidden;
}
/*3.2 代码
Name: style_pre
Example: 标签包裹内联样式的代码片段*/
dfn {
font-style: italic;
} /*一个定义项目*/
code,kbd,pre,samp {
font-family: monospace, serif;
font-size: 1em;
}
pre {
white-space: pre-wrap;
display: block;
padding: 9.5px;
margin: 0 0 10px;
font-size: 13px;
line-height: 1.42857143;
color: #333;
word-break: break-all;
word-wrap: break-word;
background-color: #f5f5f5;
border: 1px solid #ccc;
border-radius: 4px;
} /*代码块，多行代码可以使用此标签，为了正确的展示代码，注意将尖括号做转义处理*/
/*4.20 折叠
Name: mod_Huifold
Sample:
*/
.Huifold .item {
position:relative;
}
.Huifold .item h4 {
margin:0;
/*font-weight:bold;*/
position:relative;
border-top: 1px solid #fff;
font-size:16px;
line-height:22px;
padding:7px 10px;
background-color:#eee;
cursor:pointer;
padding-right:30px;
}
.Huifold .item h4 b {
position:absolute;
display: block;
cursor:pointer;
right:10px;
top:7px;
width:16px;
height:16px;
text-align:center;
color:#666;
}
.Huifold .item .info {
display:none;
padding:10px;
}