ul弹性怎么一行显示_如何制作网站弹性二级下拉菜单

/*导航*/

.top_nav{

border-top: #111 solid 1px;

height: 50px;

background-color: #faf8f5;

}

.top_nav .wid_main{

position: relative;

z-index: 5;

}

.top_nav .nav_bg_cur{

position: absolute;

left: 15px;

top: 5px;

}

.top_nav ul li{

float: left;

line-height: 50px;

width: 133.3333px;

position: relative;

}

.top_nav ul li>a{

display: block;

text-align: center;

color: #111;

font-size: 16px;

transition: all .2s;

}

.top_nav ul li.current-menu-item{

background-color: #111111;

}

.top_nav ul li.current-menu-item>a{

color: #fff;

text-indent: 1em;

position: relative;

z-index: 5;

}

.top_nav ul li.current-menu-item>a i{

display: inline-block;

width: 15px;

height: 40px;

vertical-align: middle;

background:url(../images/icon_nav.png) no-repeat center center;

margin: -4px 10px 0 15px;

}

.top_nav ul li:hover>a{

color: #fff;

text-indent: 1em;

}

.top_nav ul li .sub-menu{

background-color: #111;

text-align: center;

padding:10px 0;

display: none;

position: absolute;

width: 100%;

opacity: .9;

}

.top_nav ul li .sub-menu li{

line-height: 40px;

}

.top_nav ul li .sub-menu li a{

font-size: 14px;

color: #fff;

display: block;

transition: all .2s;

}

.top_nav ul li .sub-menu li a:before{

content: "·"; margin-right: 5px;

}

.top_nav ul li .sub-menu li a:hover{

color: #faa528;

text-indent: 1em;

}