请问能教下竖型的css导航条么?

html-css014

请问能教下竖型的css导航条么?,第1张

<ul>

<li>菜单1</li>

<li>菜单2</li>

<li>菜单3</li>

<li>菜单4</li>

</ul>

定义

css中 给 <ul>定义固定宽度

li也定义和 ul 一样的宽度再加上 float:left这样就变成树形菜单了

其他效果就看你需要啦

#navmenu2{

width:150px

text-align:center

float:left

}

#navmenu2 ul{

padding:0px

margin:0px

list-style:none

}

#navmenu2 li{

margin:0px

}

#navmenu2 a{

display:block

text-decoration:none

width:120px

border:1px

border-right:10px

border-left:20px

border-color:#60C

border-style:solid

background-color:#00F

color:#FFF

padding:7px 0px 7px 0px

}

#navmenu2 a:hover {

background-color:#000

color:#09F

border-left-color:#09f

border-right-color:#09f

border-top-color:#60c

border-bottom-color:#60c

}