Java制作二级导航菜单_CSS技巧分享：如何用css制作横排二级下拉菜单

至此，横向二级下拉菜单就制作完成了，这里附加上全部代码，以方便各位朋友参考，感谢各位朋友的浏览。

横排二级下拉菜单

* { margin:0; padding:0;}

ul, li { list-style:none;}

a { text-decoration:none;}

.nav { border:2px solid #ccc; border-right:none; overflow:hidden; float:left; margin:100px 0 0 300px;}

.nav ul li { float:left;}

.nav ul li a { width:120px; height:40px; text-align:center; line-height:40px; display:block; border-right:2px solid #ccc; background:#eee; color:#666;}

.nav ul li a:hover{ color:#f00; }

.nav ul li ul { position:absolute; display:none;}

.nav ul li ul li { float:none;}

.nav ul li ul li a { border-right:none; border-top:1px dotted #ccc; background:#f5f5f5;}

.nav ul li:hover ul{ display:block; }

• 栏目一
  • 二级栏目
  • 二级栏目
  • 二级栏目
  • 二级栏目
• 栏目二
  • 二级栏目
  • 二级栏目
  • 二级栏目
  • 二级栏目
• 栏目三
  • 二级栏目
  • 二级栏目
  • 二级栏目
  • 二级栏目
  • 二级栏目
• 栏目四
• 栏目五