@charset "UTF-8";
* {
margin:0;
padding:0;
font-family:"Microsoft YaHei",Arial,sans-serif;
font-size:14px;
}
li {
list-style:none;
}
.header {
height:60px;
background:#23262E;
}
.title {
position:absolute;
left:0;
width:220px;
height:100%;
line-height:60px;
text-align:center;
color:#009688;
font-size:30px;
}
.nav {
width:220px;
overflow-x:hidden;
background-color:#393D49;
height:800px;
}
.tab {
position:relative;
width:220px;
height:100%;
overflow-x:hidden;
}
center {
float:left;
}
.nav-item li:hover {
background-color:#009688;
width:200px;
}
.nav-item {
width:200px;
color:#fff;
text-align:center;
}
.list_dt {
background:#009688;
color:white;
width:220px;
/*padding:0 40px 0 20px;
*/
height:40px;
line-height:40px;
cursor:pointer;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
position:relative;
border-bottom:1px solid #464646;
}
.list_dt:hover {
background:#009688;
}
.list_dt:hover ._after {
display:block;
width:20px;
height:40px;
position:absolute;
left:0;
top:0;
background:#009688;
}
#open {
background:#009688;
}
#open ._after {
display:block;
width:20px;
height:40px;
position:absolute;
left:0;
top:0;
background:#009688;
}
.list_dt_icon {
position:absolute;
right:10px;
top:9px;
display:block;
width:16px;
height:16px;
background:url("../images/off.png") no-repeat;
}
#open .list_dt_icon {
background:url("../images/open.png") no-repeat;
}
.list_dd {
display:none;
}
/*.list_li {
background:#009688;
color:white;
height:40px;
line-height:40px;
cursor:pointer;
}
*/
.list_li {
width:200px;
line-height:40px;
height:40px;
border:1px solid #6b6b6b;
}
.first {
background-color:#009688;
line-height:40px;
height:40px;
width:200px;
}
.list_li:hover {
background:#009688;
height:40px;
line-height:40px;
}
#container {
position:fixed;
top:60px;
bottom:44px;
left:220px;
right:0;
top:60px;
bottom:0;
z-index:998;
width:auto;
overflow-y:auto;
box-sizing:border-box;
}
.tabp {
height:800px;
}
input {
height:38px;
line-height:1.3;
border:1px solid #e6e6e6;
background-color:#fff;
border-radius:2px;
outline:none;
outline:0;
-webkit-appearance:none;
transition:all .3s;
-webkit-transition:all .3s;
box-sizing:border-box;
padding-left:10px;
}
.tabp ul li {
margin-left:45px;
margin-top:20px;
}
.button {
margin-left:120px;
margin-top:50px;
height:38px;
line-height:38px;
padding:0 18px;
background-color:#009688;
color:#fff;
white-space:nowrap;
text-align:center;
font-size:14px;
border:none;
border-radius:2px;
cursor:pointer;
}
.nav-item .lis {
background:#009688;
}
.btnseh {
width:58px;
height:32px;
line-height:32px;
outline:none;
border:none;
background:#009688;
color:#fff;
}
.search {
margin:20px 0px;
}
更新时间:2020-05-14 10:46:23
主要实现了侧边栏的下拉菜单和选项卡切换,可以直接套用