导航各种样式

/*
导航 不兼容移动端
/
.nav{
display: block;
width: 100%;
/ 高度不可以受到限制 /
}
.nav,.nav>ul{
padding: 0px 10px;
}
.nav>ul>li{
/ display: inline-block; /
list-style: none;
float: left;
}
.nav::after{
content: “”;
display: block;
/ height: 0px; */
clear: both;
visibility: hidden;
zoom: 1;
}
.nav li>a{
display: inline-block;
text-decoration: none;
font-size: 14px;
padding: 15px;
color: #000;
}
.nav-tab{
width: 100%;
border-bottom: 1px solid #ccc;

}
.nav-tab .active>a{
border: 1px solid #ccc;
border-bottom: 1px solid #ccc;
box-shadow:1px 1px 15px 0px #ccc ;
font-weight: bold;
}
.nav-tab li{
position: relative;
top: 1px;
}
.nav-tab li>a:hover{
border: 1px solid #ccc;
border-bottom: 1px solid #ccc;
box-shadow:1px 1px 15px 0px #ccc ;
font-weight: bold;
}
.nav-pills .active>a{
background-color: #409eff;
color: #ccc;
}
.nav-pills li>a:hover{
background-color: #409eff;
color: #ccc;
}
.nav-pills{
box-shadow: 0px 2px 5px 0px #ccc;
}
/* .nav-stacked{
padding: 0px !important;
} */
.nav-stacked li{
width: 100%;
text-align: center;
padding: 0px;
}
.nav-stacked li>a{
width: 100%;
text-align: center;
}

/* 背景颜色为黑色导航条 */
.nav-inverse{
margin-top: 10px;
width: 100%;
background-color: #545c64;
}
.nav-inverse .active>a{
color: #ffba21;
}
.nav-inverse li>a{
color: #ffffff;

}
.nav-inverse li>a:hover{
color: #ffba21;
border-bottom: 2px solid #ffba21 ;
}
.nav-inverse-stacked,.nav-inverse-stacked>ul{
padding: 0px !important;
}
.nav-inverse-stacked{
background-color: #545c64;

}
.nav-inverse-stacked li>a{
width: 100%;
color: #ffffff;
}
.nav-inverse-stacked li>a:hover{
color: #ffba21;
background-color: #272c2c;
}
.nav-inverse-stacked .active>a{
color: #ffba21;
background-color: #272c2c;
}

.nav-black{
margin-top: 10px;
width: 100%;
background-color: #272c2c;
}
.nav-black .active>a{
color: #ffba21;
}
.nav-black li>a{
color: #ffffff;

}
.nav-black li>a:hover{
color: #ffba21;
border-bottom: 2px solid #ffba21 ;
}
.nav-inverse-black,.nav-inverse-stacked>ul{
padding: 0px !important;
}
.nav-inverse-black{

width: 100%;
background-color: #272c2c;

}
.nav-inverse-black li>a{
width: 100%;
color: #ffffff;
}
.nav-inverse-black li>a:hover{
color: #ffba21;
background-color: #545c64;
}
.nav-inverse-black .active>a{
color: #ffba21;
background-color: #545c64;
}

/* 定位 */
.nav-fixed-top{
position: fixed;
top: 0px;
}
.nav-fixed-left{
position: fixed;
left: 0px;
}
.nav-fixed-right{
position: fixed;
right: 0px;
}
.nav-fixed-right-15{
position: fixed;
right: 15px;
}