如何创建一个垂直导航菜单？

Here is a menu using HTML and CSS. 菜单项水平放置，子菜单使用垂直布局。主菜单项目应该如何更改为垂直布局？如何创建一个垂直导航菜单？

<ul> 
    <li> 
    <a>item1</a> 
    <ul> 
     <li><a>subitem1</a></li> 
     <li><a>subitem1</a></li> 
     <li><a>subitem1</a></li> 
    </ul> 
    </li> 
</ul>

来源

2013-10-19 TDJSS

哦对不起，请检查此页http://jsfiddle.net/DqvxR/190/ – TDJSS

这不太适合问答格式。反正访问这个链接并复制http://www.cssdrive.com/index.php/menudesigns/category/C19/你想要的菜单 – ankit

你可以从谷歌下载预开发的菜单，并研究它们使你自己。或者使用它们。其中一个是：http://cssmenumaker.com/ –

你必须做一些小的改变，它将作为垂直工作。而当你寻找更多风格来添加它时，你可以轻松完成。

检查这个小提琴CLICK HERE

#menu 
{ 
    width: 120px;/*change width*/ 
} 
#menu li 
{ 

    display: block; /*keep it block*/ 
    } 
#menu ul 
{ 

    top: 0; /*change this */ 
    left: 100%; /*change this */ 
} 
#menu ul li:first-child > a:after 
{ 
    content: ''; 
    position: absolute; 
    left:-13px; /* change this*/ 
    top:7px; /* change this*/ 
    width: 0; 
    height: 0; 
    border: 5px solid transparent; /* change this*/ 
    /*border-right: 5px solid transparent;*/ /*don't need this*/ 
    border-right: 8px solid #444; /* change this*/ 
} 

#menu ul li:first-child a:hover:after 
{ 
    border-right-color: #04acec; /* change this*/ 
}

我在评论中写道改变什么具体的实现你想要什么。您可以操作更多

来源

2013-10-19 05:40:48

如何创建一个垂直导航菜单？

回答

相关问题