|
|
/* 设置字符集为UTF-8，确保页面可以正确显示中文等字符 */
|
|
|
@charset "utf-8";
|
|
|
|
|
|
/* 导入layui框架的CSS文件，layui是一个前端UI框架 */
|
|
|
@import url(../lib/layui/css/layui.css);
|
|
|
|
|
|
/* 重置所有元素的默认样式 */
|
|
|
* {
|
|
|
margin: 0px;
|
|
|
/* 移除所有元素的默认外边距 */
|
|
|
padding: 0px;
|
|
|
/* 移除所有元素的默认内边距 */
|
|
|
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
|
/* 设置默认字体为"Helvetica Neue", 如果没有则使用Helvetica, 再没有则使用Arial, 最后使用sans-serif系列字体 */
|
|
|
}
|
|
|
|
|
|
/* 移除所有链接的下划线 */
|
|
|
a {
|
|
|
text-decoration: none;
|
|
|
}
|
|
|
|
|
|
/* 设置HTML元素的宽度为100%，高度也为100%，并确保整个页面的内容在水平方向上不可滚动，垂直方向上可以滚动 */
|
|
|
html {
|
|
|
width: 100%;
|
|
|
/* 宽度为100% */
|
|
|
height: 100%;
|
|
|
/* 高度为100% */
|
|
|
overflow-x: hidden;
|
|
|
/* 水平方向上隐藏滚动条 */
|
|
|
overflow-y: auto;
|
|
|
/* 垂直方向上显示滚动条 */
|
|
|
}
|
|
|
|
|
|
/* 设置body元素的宽度为100%，最小高度为100%，确保内容可以填满整个视口 */
|
|
|
body {
|
|
|
width: 100%;
|
|
|
/* 宽度为100% */
|
|
|
min-height: 100%;
|
|
|
/* 最小高度为100% */
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/* 容器的基础内边距样式 */
|
|
|
.x-body {
|
|
|
padding: 20px;
|
|
|
/* 设置容器的内边距为20像素 */
|
|
|
}
|
|
|
|
|
|
/* 导航栏的样式 */
|
|
|
.x-nav {
|
|
|
padding: 0 20px;
|
|
|
/* 设置导航栏左右内边距为20像素 */
|
|
|
position: relative;
|
|
|
/* 相对定位，为子元素提供定位上下文 */
|
|
|
z-index: 99;
|
|
|
/* 设置导航栏的堆叠顺序，确保在其他元素之上 */
|
|
|
border-bottom: 1px solid #e5e5e5;
|
|
|
/* 在导航栏底部添加一条1像素的灰色边框 */
|
|
|
line-height: 39px;
|
|
|
/* 设置行高为39像素，使文本垂直居中 */
|
|
|
height: 39px;
|
|
|
/* 设置导航栏的高度为39像素 */
|
|
|
overflow: hidden;
|
|
|
/* 如果内容超出，则隐藏超出部分 */
|
|
|
}
|
|
|
|
|
|
/* 错误：'xblock' 应该带有 '.' 前缀，表示类选择器 */
|
|
|
.xblock {
|
|
|
display: block;
|
|
|
/* 将元素设置为块级元素 */
|
|
|
margin-bottom: 10px;
|
|
|
/* 在元素下方添加10像素的外边距 */
|
|
|
padding: 5px;
|
|
|
/* 设置元素的内边距为5像素 */
|
|
|
line-height: 22px;
|
|
|
/* 设置行高为22像素 */
|
|
|
/* border-left: 5px solid #009688; */ /* 注释掉的左边框样式，如果需要可以取消注释 */
|
|
|
border-radius: 0 2px 2px 0;
|
|
|
/* 设置边框圆角，左上角为0，其他角为2像素 */
|
|
|
background-color: #f2f2f2;
|
|
|
/* 设置背景颜色为浅灰色 */
|
|
|
}
|
|
|
|
|
|
/* 右浮动样式 */
|
|
|
.x-right {
|
|
|
float: right;
|
|
|
/* 将元素向右浮动 */
|
|
|
}
|
|
|
|
|
|
/* 搜索操作区域的样式 */
|
|
|
.x-so {
|
|
|
/* text-align: center; */ /* 注释掉的文本居中样式，如果需要可以取消注释 */
|
|
|
/* background: #f2f2f2 url() 0 0 no-repeat; */ /* 注释掉的背景图片样式，如果需要可以取消注释 */
|
|
|
margin-bottom: 20px;
|
|
|
/* 在元素下方添加20像素的外边距 */
|
|
|
}
|
|
|
|
|
|
/* 搜索输入框的样式 */
|
|
|
.x-so input.layui-input {
|
|
|
width: 150px;
|
|
|
/* 设置输入框的宽度为150像素 */
|
|
|
padding-left: 25px;
|
|
|
/* 设置输入框的左内边距为25像素 */
|
|
|
}
|
|
|
|
|
|
/* 表单标签的样式 */
|
|
|
.x-so .layui-form-label {
|
|
|
display: inline-block;
|
|
|
/* 将表单标签设置为行内块级元素 */
|
|
|
}
|
|
|
|
|
|
/* 输入框和按钮的显示样式 */
|
|
|
.x-so input.layui-input,
|
|
|
.x-so input.layui-btn {
|
|
|
display: inline-block;
|
|
|
/* 将输入框和按钮设置为行内块级元素 */
|
|
|
}
|
|
|
|
|
|
/* 红色文本样式 */
|
|
|
.x-red {
|
|
|
color: red;
|
|
|
/* 设置文本颜色为红色 */
|
|
|
}
|
|
|
|
|
|
/* 链接文本颜色样式 */
|
|
|
.x-a {
|
|
|
color: #1AA093;
|
|
|
/* 设置链接文本颜色为特定的绿色 */
|
|
|
}
|
|
|
|
|
|
/* 链接鼠标悬停时的文本颜色样式 */
|
|
|
.x-a:hover {
|
|
|
color: #127F74;
|
|
|
/* 设置链接鼠标悬停时的文本颜色为深绿色 */
|
|
|
}
|
|
|
|
|
|
/* 排序操作区域的样式 */
|
|
|
.x-sort {
|
|
|
height: 30px;
|
|
|
/* 设置排序操作区域的高度为30像素 */
|
|
|
}
|
|
|
|
|
|
/* 显示操作，用于鼠标指针变为指针样式 */
|
|
|
.x-show {
|
|
|
cursor: pointer;
|
|
|
/* 将鼠标指针变为指针形状，表示元素是可点击的 */
|
|
|
}
|
|
|
|
|
|
/* layui表单开关控件的样式 */
|
|
|
.layui-form-switch {
|
|
|
margin-top: 0px;
|
|
|
/* 设置开关控件的上外边距为0像素，可能用于微调位置 */
|
|
|
}
|
|
|
|
|
|
/* layui输入框和文本域获得焦点时的边框颜色样式 */
|
|
|
.layui-input:focus, .layui-textarea:focus {
|
|
|
border-color: #189f92!important;
|
|
|
/* 设置输入框和文本域获得焦点时的边框颜色为特定的蓝色，并使用!important提高样式优先级 */
|
|
|
}
|
|
|
|
|
|
|
|
|
/* 分页容器的样式 */
|
|
|
.page {
|
|
|
margin-top: 20px;
|
|
|
/* 设置分页容器顶部外边距为20像素 */
|
|
|
text-align: center;
|
|
|
/* 将分页容器内的内容居中显示 */
|
|
|
}
|
|
|
|
|
|
/* 分页链接的样式 */
|
|
|
.page a {
|
|
|
display: inline-block;
|
|
|
/* 将链接设置为行内块级元素 */
|
|
|
background: #fff url(#) 0 0 no-repeat;
|
|
|
/* 设置链接的背景颜色和背景图片，这里没有指定图片地址 */
|
|
|
color: #888;
|
|
|
/* 设置链接文本颜色为灰色 */
|
|
|
padding: 10px;
|
|
|
/* 设置链接的内边距为10像素 */
|
|
|
min-width: 15px;
|
|
|
/* 设置链接的最小宽度为15像素 */
|
|
|
border: 1px solid #E2E2E2;
|
|
|
/* 设置链接的边框为1像素的浅灰色 */
|
|
|
}
|
|
|
|
|
|
/* 分页span元素的样式 */
|
|
|
.page span {
|
|
|
display: inline-block;
|
|
|
/* 将span元素设置为行内块级元素 */
|
|
|
padding: 10px;
|
|
|
/* 设置span元素的内边距为10像素 */
|
|
|
min-width: 15px;
|
|
|
/* 设置span元素的最小宽度为15像素 */
|
|
|
border: 1px solid #E2E2E2;
|
|
|
/* 设置span元素的边框为1像素的浅灰色 */
|
|
|
}
|
|
|
|
|
|
/* 当前激活页码的span元素的样式 */
|
|
|
.page span.current {
|
|
|
display: inline-block;
|
|
|
/* 将当前激活的页码设置为行内块级元素 */
|
|
|
background: #009688 url(#) 0 0 no-repeat;
|
|
|
/* 设置当前激活页码的背景颜色和背景图片，这里没有指定图片地址 */
|
|
|
color: #fff;
|
|
|
/* 设置当前激活页码的文本颜色为白色 */
|
|
|
padding: 10px;
|
|
|
/* 设置当前激活页码的内边距为10像素 */
|
|
|
min-width: 15px;
|
|
|
/* 设置当前激活页码的最小宽度为15像素 */
|
|
|
border: 1px solid #009688;
|
|
|
/* 设置当前激活页码的边框为1像素的绿色 */
|
|
|
}
|
|
|
|
|
|
/* 分页列表项的样式 */
|
|
|
.page .pagination li {
|
|
|
display: inline-block;
|
|
|
/* 将列表项设置为行内块级元素 */
|
|
|
margin-right: 5px;
|
|
|
/* 设置列表项的右外边距为5像素 */
|
|
|
text-align: center;
|
|
|
/* 将列表项的内容居中显示 */
|
|
|
}
|
|
|
|
|
|
/* 激活状态下的分页列表项span元素的样式 */
|
|
|
.page .pagination li.active span {
|
|
|
background: #009688 url(#) 0 0 no-repeat;
|
|
|
/* 设置激活状态下列表项的背景颜色和背景图片，这里没有指定图片地址 */
|
|
|
color: #fff;
|
|
|
/* 设置激活状态下列表项的文本颜色为白色 */
|
|
|
border: 1px solid #009688;
|
|
|
/* 设置激活状态下列表项的边框为1像素的绿色 */
|
|
|
}
|
|
|
|
|
|
|
|
|
/*登录样式*/
|
|
|
/*头部*/
|
|
|
/* 容器样式，通常用于页面的顶部导航 */
|
|
|
.container {
|
|
|
width: 100%;
|
|
|
/* 设置容器宽度为100% */
|
|
|
height: 45px;
|
|
|
/* 设置容器高度为45像素 */
|
|
|
background-color: #222;
|
|
|
/* 设置容器背景颜色为深灰色 */
|
|
|
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
|
|
|
/* 设置容器底部边框为半透明的白色 */
|
|
|
}
|
|
|
|
|
|
/* 容器内的logo链接样式 */
|
|
|
.container .logo a {
|
|
|
float: left;
|
|
|
/* 设置链接左浮动 */
|
|
|
color: #fff;
|
|
|
/* 设置链接文本颜色为白色 */
|
|
|
font-size: 18px;
|
|
|
/* 设置链接字体大小为18像素 */
|
|
|
padding-left: 20px;
|
|
|
/* 设置链接左侧内边距为20像素 */
|
|
|
line-height: 45px;
|
|
|
/* 设置链接行高为45像素，与容器高度一致，实现垂直居中 */
|
|
|
width: 200px;
|
|
|
/* 设置链接宽度为200像素 */
|
|
|
}
|
|
|
|
|
|
/* 容器右侧内容的样式 */
|
|
|
.container .right {
|
|
|
background-color: rgba(0, 0, 0, 0);
|
|
|
/* 设置背景颜色为透明 */
|
|
|
float: right;
|
|
|
/* 设置内容右浮动 */
|
|
|
}
|
|
|
|
|
|
/* 容器左侧打开按钮的样式 */
|
|
|
.container .left_open {
|
|
|
height: 45px;
|
|
|
/* 设置高度为45像素，与容器高度一致 */
|
|
|
float: left;
|
|
|
/* 设置左浮动 */
|
|
|
}
|
|
|
|
|
|
/* 容器左侧打开按钮内的图标样式 */
|
|
|
.container .left_open i {
|
|
|
display: block;
|
|
|
/* 设置图标为块级元素 */
|
|
|
background: rgba(255, 255, 255, 0.1) url(#) 0 0 no-repeat;
|
|
|
/* 设置图标背景颜色和图片，这里没有指定图片地址 */
|
|
|
color: #fff;
|
|
|
/* 设置图标颜色为白色 */
|
|
|
width: 32px;
|
|
|
/* 设置图标宽度为32像素 */
|
|
|
height: 32px;
|
|
|
/* 设置图标高度为32像素 */
|
|
|
line-height: 32px;
|
|
|
/* 设置图标行高为32像素，实现垂直居中 */
|
|
|
border-radius: 3px;
|
|
|
/* 设置图标边角为3像素的圆角 */
|
|
|
text-align: center;
|
|
|
/* 设置图标文本居中 */
|
|
|
margin-top: 7px;
|
|
|
/* 设置图标顶部外边距为7像素，实现垂直居中 */
|
|
|
cursor: pointer;
|
|
|
/* 设置鼠标悬停时为指针形状 */
|
|
|
}
|
|
|
|
|
|
/* 容器左侧打开按钮内的图标悬停样式 */
|
|
|
.container .left_open i:hover {
|
|
|
background: rgba(255, 255, 255, 0.3) url(#) 0 0 no-repeat;
|
|
|
/* 设置图标悬停时的背景颜色和图片，这里没有指定图片地址 */
|
|
|
}
|
|
|
|
|
|
/* 容器左侧内容的样式 */
|
|
|
.container .left {
|
|
|
background-color: rgba(0, 0, 0, 0);
|
|
|
/* 设置背景颜色为透明 */
|
|
|
float: left;
|
|
|
/* 设置左浮动 */
|
|
|
}
|
|
|
|
|
|
/* 容器内的导航项样式 */
|
|
|
.container .layui-nav-item {
|
|
|
line-height: 45px;
|
|
|
/* 设置导航项行高为45像素，与容器高度一致 */
|
|
|
}
|
|
|
|
|
|
/* 容器内的导航更多按钮样式 */
|
|
|
.container .layui-nav-more {
|
|
|
top: 20px;
|
|
|
/* 设置导航更多按钮的顶部位置 */
|
|
|
}
|
|
|
|
|
|
/* 容器内的导航子菜单样式 */
|
|
|
.container .layui-nav-child {
|
|
|
top: 50px;
|
|
|
/* 设置导航子菜单的顶部位置 */
|
|
|
}
|
|
|
|
|
|
/* 容器内的导航子菜单项图标样式 */
|
|
|
.container .layui-nav-child i {
|
|
|
margin-right: 10px;
|
|
|
/* 设置导航子菜单项图标右侧外边距为10像素 */
|
|
|
}
|
|
|
|
|
|
/* 导航项链接的样式 */
|
|
|
.layui-nav .layui-nav-item a {
|
|
|
color: #fff;
|
|
|
/* 设置导航项链接文本颜色为白色 */
|
|
|
cursor: pointer;
|
|
|
/* 设置鼠标悬停时为指针形状 */
|
|
|
}
|
|
|
|
|
|
/* 导航子菜单链接的样式 */
|
|
|
.layui-nav .layui-nav-child a {
|
|
|
color: #333;
|
|
|
/* 设置导航子菜单链接文本颜色为深灰色 */
|
|
|
cursor: pointer;
|
|
|
/* 设置鼠标悬停时为指针形状 */
|
|
|
}
|
|
|
|
|
|
/* 左侧导航栏的样式 */
|
|
|
.left-nav {
|
|
|
position: absolute;
|
|
|
/* 设置定位方式为绝对定位 */
|
|
|
top: 46px;
|
|
|
/* 设置顶部距离为46像素 */
|
|
|
bottom: 42px;
|
|
|
/* 设置底部距离为42像素 */
|
|
|
left: 0;
|
|
|
/* 设置左侧距离为0 */
|
|
|
z-index: 2;
|
|
|
/* 设置堆叠顺序为2 */
|
|
|
padding-top: 10px;
|
|
|
/* 设置顶部内边距为10像素 */
|
|
|
background-color: #EEEEEE;
|
|
|
/* 设置背景颜色为浅灰色 */
|
|
|
width: 220px;
|
|
|
/* 设置宽度为220像素 */
|
|
|
max-width: 220px;
|
|
|
/* 设置最大宽度为220像素 */
|
|
|
overflow: auto;
|
|
|
/* 设置内容溢出时出现滚动条 */
|
|
|
overflow-x: hidden;
|
|
|
/* 隐藏水平滚动条 */
|
|
|
border-right: 1px solid #e5e5e5;
|
|
|
/* 设置右侧边框为浅灰色 */
|
|
|
}
|
|
|
|
|
|
/* 左侧导航栏中列表项的样式 */
|
|
|
.left-nav #nav li {
|
|
|
border-bottom: 1px solid #e5e5e5;
|
|
|
/* 设置列表项底部边框为浅灰色 */
|
|
|
}
|
|
|
|
|
|
/* 左侧导航栏中列表项悬停时的样式 */
|
|
|
.left-nav #nav li:hover > a {
|
|
|
/*color: blue;*/ /* 注释掉了，如果需要可以取消注释来设置悬停时的文本颜色 */
|
|
|
}
|
|
|
|
|
|
/* 左侧导航栏中当前激活的列表项样式 */
|
|
|
.left-nav #nav .current {
|
|
|
background-color: rgba(0, 0, 0, 0.3);
|
|
|
/* 设置背景颜色为半透明的黑色 */
|
|
|
}
|
|
|
|
|
|
/* 左侧导航栏中列表项链接的样式 */
|
|
|
.left-nav #nav li a {
|
|
|
font-size: 14px;
|
|
|
/* 设置字体大小为14像素 */
|
|
|
padding: 10px 15px 10px 20px;
|
|
|
/* 设置内边距 */
|
|
|
display: block;
|
|
|
/* 设置为块级元素 */
|
|
|
cursor: pointer;
|
|
|
/* 设置鼠标悬停时为指针形状 */
|
|
|
}
|
|
|
|
|
|
/* 左侧导航栏中列表项链接的标题样式 */
|
|
|
.left-nav #nav li a cite {
|
|
|
font-size: 14px;
|
|
|
/* 设置标题字体大小为14像素 */
|
|
|
}
|
|
|
|
|
|
/* 左侧导航栏中子菜单的默认样式（隐藏） */
|
|
|
.left-nav #nav li .sub-menu {
|
|
|
display: none;
|
|
|
/* 设置子菜单默认不显示 */
|
|
|
}
|
|
|
|
|
|
/* 左侧导航栏中展开的子菜单样式 */
|
|
|
.left-nav #nav li .opened {
|
|
|
display: block;
|
|
|
/* 设置子菜单显示为块级元素 */
|
|
|
}
|
|
|
|
|
|
/* 左侧导航栏中展开的子菜单悬停时的样式 */
|
|
|
.left-nav #nav li .opened:hover {
|
|
|
/*background: #fff url() 0 0 no-repeat;*/ /* 注释掉了，如果需要可以取消注释来设置悬停时的背景 */
|
|
|
}
|
|
|
|
|
|
/* 左侧导航栏中展开的子菜单中当前激活的列表项样式 */
|
|
|
.left-nav #nav li .opened .current {
|
|
|
/* 没有具体样式，可能需要根据实际情况添加 */
|
|
|
}
|
|
|
|
|
|
/* 左侧导航栏中子菜单列表项悬停时的样式 */
|
|
|
.left-nav #nav li .sub-menu li:hover {
|
|
|
/*color: blue;*/ /* 注释掉了，如果需要可以取消注释来设置悬停时的文本颜色 */
|
|
|
/*background: #fff url() 0 0 no-repeat;*/ /* 注释掉了，如果需要可以取消注释来设置悬停时的背景 */
|
|
|
}
|
|
|
|
|
|
/* 子菜单列表项链接的样式 */
|
|
|
.left-nav #nav li .sub-menu li a {
|
|
|
padding: 12px 15px 12px 30px;
|
|
|
/* 设置内边距 */
|
|
|
font-size: 14px;
|
|
|
/* 设置字体大小为14像素 */
|
|
|
cursor: pointer;
|
|
|
/* 设置鼠标悬停时为指针形状 */
|
|
|
}
|
|
|
|
|
|
/* 子菜单中嵌套的子菜单列表项链接的样式 */
|
|
|
.left-nav #nav li .sub-menu li .sub-menu li a {
|
|
|
padding-left: 45px;
|
|
|
/* 设置左侧内边距为45像素，为嵌套的子菜单提供更多空间 */
|
|
|
}
|
|
|
|
|
|
/* 子菜单列表项链接鼠标悬停时的样式 */
|
|
|
.left-nav #nav li .sub-menu li a:hover {
|
|
|
color: #148cf1;
|
|
|
/* 设置鼠标悬停时的文本颜色为蓝色 */
|
|
|
}
|
|
|
|
|
|
/* 子菜单列表项链接中的图标样式 */
|
|
|
.left-nav #nav li .sub-menu li a i {
|
|
|
font-size: 12px;
|
|
|
/* 设置图标字体大小为12像素 */
|
|
|
}
|
|
|
|
|
|
/* 主菜单列表项链接中的图标样式 */
|
|
|
.left-nav #nav li a i {
|
|
|
padding-right: 10px;
|
|
|
/* 设置图标右侧内边距为10像素 */
|
|
|
line-height: 14px;
|
|
|
/* 设置图标行高为14像素 */
|
|
|
}
|
|
|
|
|
|
/* 主菜单列表项右侧内容的样式 */
|
|
|
.left-nav #nav li .nav_right {
|
|
|
float: right;
|
|
|
/* 设置内容右浮动 */
|
|
|
font-size: 16px;
|
|
|
/* 设置字体大小为16像素 */
|
|
|
}
|
|
|
|
|
|
/* 左侧导航栏收起按钮的样式 */
|
|
|
.x-slide_left {
|
|
|
width: 17px;
|
|
|
/* 设置宽度为17像素 */
|
|
|
height: 61px;
|
|
|
/* 设置高度为61像素 */
|
|
|
background: url(#) 0 0 no-repeat;
|
|
|
/* 设置背景图片，目前为空，需要指定图片URL */
|
|
|
position: absolute;
|
|
|
/* 设置定位方式为绝对定位 */
|
|
|
top: 200px;
|
|
|
/* 设置顶部距离为200像素 */
|
|
|
left: 221px;
|
|
|
/* 设置左侧距离为221像素 */
|
|
|
cursor: pointer;
|
|
|
/* 设置鼠标悬停时为指针形状 */
|
|
|
z-index: 3;
|
|
|
/* 设置堆叠顺序为3 */
|
|
|
}
|
|
|
|
|
|
/* 页面内容的样式 */
|
|
|
.page-content {
|
|
|
position: absolute;
|
|
|
/* 绝对定位，相对于最近的已定位祖先元素 */
|
|
|
top: 46px;
|
|
|
/* 顶部距离为46像素 */
|
|
|
right: 0;
|
|
|
/* 右侧距离为0 */
|
|
|
bottom: 42px;
|
|
|
/* 底部距离为42像素 */
|
|
|
left: 221px;
|
|
|
/* 左侧距离为221像素 */
|
|
|
overflow: hidden;
|
|
|
/* 超出内容隐藏 */
|
|
|
z-index: 1;
|
|
|
/* 堆叠顺序为1 */
|
|
|
}
|
|
|
|
|
|
/* 页面内容背景的样式，用于遮罩层 */
|
|
|
.page-content-bg {
|
|
|
position: absolute;
|
|
|
/* 绝对定位，相对于最近的已定位祖先元素 */
|
|
|
top: 46px;
|
|
|
/* 顶部距离为46像素 */
|
|
|
right: 0;
|
|
|
/* 右侧距离为0 */
|
|
|
bottom: 42px;
|
|
|
/* 底部距离为42像素 */
|
|
|
left: 221px;
|
|
|
/* 左侧距离为221像素 */
|
|
|
background: rgba(0,0,0,0.5);
|
|
|
/* 半透明黑色背景 */
|
|
|
url() 0 0 no-repeat;
|
|
|
/* 背景图片，目前为空，需要指定图片URL */
|
|
|
overflow: hidden;
|
|
|
/* 超出内容隐藏 */
|
|
|
z-index: 100;
|
|
|
/* 堆叠顺序为100 */
|
|
|
display: none;
|
|
|
/* 默认不显示 */
|
|
|
}
|
|
|
|
|
|
/* 页面内容中的标签页样式 */
|
|
|
.page-content .tab {
|
|
|
height: 100%;
|
|
|
/* 高度为100% */
|
|
|
width: 100%;
|
|
|
/* 宽度为100% */
|
|
|
background: #EFEEF0;
|
|
|
/* 背景颜色为淡灰色 */
|
|
|
url(#) 0 0 no-repeat;
|
|
|
/* 背景图片，目前为空，需要指定图片URL */
|
|
|
margin: 0px;
|
|
|
/* 外边距为0 */
|
|
|
}
|
|
|
|
|
|
/* 标签页标题的样式 */
|
|
|
.page-content .layui-tab-title {
|
|
|
height: 35px;
|
|
|
/* 高度为35像素 */
|
|
|
background: #EFEEF0;
|
|
|
/* 背景颜色为淡灰色 */
|
|
|
position: relative;
|
|
|
/* 相对定位 */
|
|
|
z-index: 100;
|
|
|
/* 堆叠顺序为100 */
|
|
|
}
|
|
|
|
|
|
/* 标签页标题中首页图标的样式 */
|
|
|
.page-content .layui-tab-title li.home i {
|
|
|
padding-right: 5px;
|
|
|
/* 右侧内边距为5像素 */
|
|
|
}
|
|
|
|
|
|
/* 隐藏首页标签的关闭按钮 */
|
|
|
.page-content .layui-tab-title li.home .layui-tab-close {
|
|
|
display: none;
|
|
|
/* 不显示 */
|
|
|
}
|
|
|
|
|
|
/* 标签页标题中所有列表项的样式 */
|
|
|
.page-content .layui-tab-title li {
|
|
|
line-height: 35px;
|
|
|
/* 行高为35像素 */
|
|
|
}
|
|
|
|
|
|
/* 当前激活标签页的样式 */
|
|
|
.page-content .layui-tab-title .layui-this:after {
|
|
|
height: 36px;
|
|
|
/* 底部边框高度为36像素 */
|
|
|
}
|
|
|
|
|
|
/* 标签页关闭按钮的样式 */
|
|
|
.page-content .layui-tab-title li .layui-tab-close {
|
|
|
border-radius: 50%;
|
|
|
/* 圆角边框 */
|
|
|
}
|
|
|
|
|
|
/* 当前激活标签页的背景样式 */
|
|
|
.page-content .layui-tab-title .layui-this {
|
|
|
background: #fff;
|
|
|
/* 背景颜色为白色 */
|
|
|
url(#) 0 0 no-repeat;
|
|
|
/* 背景图片，目前为空，需要指定图片URL */
|
|
|
}
|
|
|
|
|
|
/* 标签页底部的样式 */
|
|
|
.page-content .layui-tab-bar {
|
|
|
height: 34px;
|
|
|
/* 高度为34像素 */
|
|
|
line-height: 35px;
|
|
|
/* 行高为35像素 */
|
|
|
}
|
|
|
|
|
|
/* 标签页内容的样式 */
|
|
|
.page-content .layui-tab-content {
|
|
|
position: absolute;
|
|
|
/* 绝对定位 */
|
|
|
top: 36px;
|
|
|
/* 顶部距离为36像素 */
|
|
|
bottom: 0px;
|
|
|
/* 底部距离为0像素 */
|
|
|
width: 100%;
|
|
|
/* 宽度为100% */
|
|
|
background: #fff;
|
|
|
/* 背景颜色为白色 */
|
|
|
url(#) 0 0 no-repeat;
|
|
|
/* 背景图片，目前为空，需要指定图片URL */
|
|
|
padding: 0px;
|
|
|
/* 内边距为0 */
|
|
|
overflow: hidden;
|
|
|
/* 超出内容隐藏 */
|
|
|
}
|
|
|
|
|
|
/* 标签页中每个标签项的样式 */
|
|
|
.page-content .layui-tab-content .layui-tab-item {
|
|
|
width: 100%;
|
|
|
/* 宽度为100% */
|
|
|
height: 100%;
|
|
|
/* 高度为100% */
|
|
|
}
|
|
|
|
|
|
/* 标签页中每个标签项内部的iframe样式 */
|
|
|
.page-content .layui-tab-content .layui-tab-item iframe {
|
|
|
width: 100%;
|
|
|
/* 宽度为100% */
|
|
|
height: 100%;
|
|
|
/* 高度为100% */
|
|
|
}
|
|
|
|
|
|
/* 轮播图相关元素的样式 */
|
|
|
.x-admin-carousel,
|
|
|
.layui-carousel,
|
|
|
.x-admin-carousel>[carousel-item]>* {
|
|
|
background-color: #fff;
|
|
|
/* 设置背景颜色为白色 */
|
|
|
}
|
|
|
|
|
|
/* 后台日志容器的样式 */
|
|
|
.x-admin-backlog .x-admin-backlog-body {
|
|
|
display: block;
|
|
|
/* 将元素设置为块级元素 */
|
|
|
padding: 10px 15px;
|
|
|
/* 设置内边距为10像素上/下和15像素左/右 */
|
|
|
background-color: #f8f8f8;
|
|
|
/* 设置背景颜色为浅灰色 */
|
|
|
color: #999;
|
|
|
/* 设置文本颜色为灰色 */
|
|
|
border-radius: 2px;
|
|
|
/* 设置边框圆角为2像素 */
|
|
|
transition: all .3s;
|
|
|
/* 设置所有属性变化时的过渡效果持续时间为0.3秒 */
|
|
|
-webkit-transition: all .3s;
|
|
|
/* 设置所有属性变化时的过渡效果持续时间为0.3秒，针对旧版webkit浏览器 */
|
|
|
}
|
|
|
|
|
|
/* 后台日志标题的样式 */
|
|
|
.x-admin-backlog-body h3 {
|
|
|
padding-bottom: 10px;
|
|
|
/* 设置标题底部内边距为10像素 */
|
|
|
font-size: 12px;
|
|
|
/* 设置字体大小为12像素 */
|
|
|
}
|
|
|
|
|
|
/* 后台日志内容中引用文本的样式 */
|
|
|
.x-admin-backlog-body p cite {
|
|
|
font-style: normal;
|
|
|
/* 设置字体样式为正常 */
|
|
|
font-size: 30px;
|
|
|
/* 设置字体大小为30像素 */
|
|
|
font-weight: 300;
|
|
|
/* 设置字体权重为300 */
|
|
|
color: #009688;
|
|
|
/* 设置文本颜色为特定的蓝色 */
|
|
|
}
|
|
|
|
|
|
/* 后台日志容器鼠标悬停时的样式 */
|
|
|
.x-admin-backlog-body:hover {
|
|
|
background-color: #CFCFCF;
|
|
|
/* 设置鼠标悬停时背景颜色为深灰色 */
|
|
|
color: #888;
|
|
|
/* 设置鼠标悬停时文本颜色为深灰色 */
|
|
|
}
|
|
|
|
|
|
|
|
|
/* 欢迎页脚的样式 */
|
|
|
.welcome-footer {
|
|
|
padding: 30px 0;
|
|
|
/* 设置顶部和底部内边距为30像素 */
|
|
|
line-height: 30px;
|
|
|
/* 设置行高为30像素 */
|
|
|
text-align: center;
|
|
|
/* 设置文本居中对齐 */
|
|
|
background-color: #eee;
|
|
|
/* 设置背景颜色为浅灰色 */
|
|
|
color: #666;
|
|
|
/* 设置文本颜色为灰色 */
|
|
|
font-weight: 300;
|
|
|
/* 设置字体权重为300 */
|
|
|
}
|
|
|
|
|
|
/* 在layui布局管理员的页脚演示样式 */
|
|
|
body .layui-layout-admin .footer-demo {
|
|
|
height: auto;
|
|
|
/* 设置高度为自动 */
|
|
|
padding: 15px 0;
|
|
|
/* 设置顶部和底部内边距为15像素 */
|
|
|
line-height: 26px;
|
|
|
/* 设置行高为26像素 */
|
|
|
}
|
|
|
|
|
|
/* 欢迎页脚中链接的样式 */
|
|
|
.welcome-footer a {
|
|
|
padding: 0 5px;
|
|
|
/* 设置左右内边距为5像素 */
|
|
|
}
|
|
|
|
|
|
/* 表格单元格的样式 */
|
|
|
table th, table td {
|
|
|
word-break: break-all;
|
|
|
/* 允许在表格单元格中单词断行 */
|
|
|
}
|
|
|
|
|
|
/* 固定在底部的页脚样式 */
|
|
|
.footer {
|
|
|
position: fixed;
|
|
|
/* 设置定位为固定 */
|
|
|
bottom: 0px;
|
|
|
/* 设置底部距离为0像素 */
|
|
|
width: 100%;
|
|
|
/* 设置宽度为100% */
|
|
|
background-color: #222;
|
|
|
/* 设置背景颜色为深灰色 */
|
|
|
border-top: 1px solid rgba(255, 255, 255, 0.2);
|
|
|
/* 设置顶部边框为半透明白色 */
|
|
|
line-height: 41px;
|
|
|
/* 设置行高为41像素 */
|
|
|
color: #fff;
|
|
|
/* 设置文本颜色为白色 */
|
|
|
/*padding-left: 10px;*/ /* 注释掉的左内边距样式，可能不需要 */
|
|
|
}
|
|
|
|
|
|
/* 页脚中版权信息的样式 */
|
|
|
.footer .copyright {
|
|
|
margin-left: 10px;
|
|
|
/* 设置左边距为10像素 */
|
|
|
}
|
|
|
|
|
|
/* 响应式设计：当屏幕宽度小于768像素时的样式 */
|
|
|
@media screen and (max-width: 768px) {
|
|
|
.fast-add {
|
|
|
display: none;
|
|
|
/* 隐藏快速添加按钮 */
|
|
|
}
|
|
|
.layui-nav .to-index {
|
|
|
display: none;
|
|
|
/* 隐藏导航栏中的首页链接 */
|
|
|
}
|
|
|
.container .logo a {
|
|
|
width: 140px;
|
|
|
/* 设置logo链接的宽度为140像素 */
|
|
|
}
|
|
|
.container .left_open {
|
|
|
/*float: right;*/ /* 注释掉的浮动样式，可能不需要 */
|
|
|
}
|
|
|
.left-nav {
|
|
|
left: -221px;
|
|
|
/* 设置左侧导航栏的左边距为-221像素，隐藏导航栏 */
|
|
|
}
|
|
|
.page-content {
|
|
|
left: 0px;
|
|
|
/* 设置页面内容的左边距为0像素 */
|
|
|
}
|
|
|
.page-content .layui-tab-content .layui-tab-item {
|
|
|
-webkit-overflow-scrolling: touch;
|
|
|
/* 设置在iOS设备上滚动更流畅 */
|
|
|
overflow-y: scroll;
|
|
|
/* 设置垂直方向上内容溢出时出现滚动条 */
|
|
|
}
|
|
|
.x-so input.layui-input {
|
|
|
width: 100%;
|
|
|
/* 设置输入框宽度为100% */
|
|
|
margin: 10px;
|
|
|
/* 设置上下外边距为10像素 */
|
|
|
}
|
|
|
|
|
|
.layui-input {
|
|
|
margin-left: 20px;
|
|
|
/* 设置输入框的左边距为20像素 */
|
|
|
}
|
|
|
}
|
|
|
|
|
|
|
