css如何实现垂直导航栏和水平导航栏

这篇文章给大家分享的是有关css如何实现垂直导航栏和水平导航栏的内容。小编觉得挺实用的，因此分享给大家做个参考，一起跟随小编过来看看吧。
　　垂直导航栏的样式
　　

　　ul{
　　list-style-type:none;
　　margin:0;
　　padding:0;
　　}
　　a:link,a:visited{
　　display:block;
　　font-weight:bold;
　　color:#FFFFFF;
　　background-color:#98bf21;
　　width:120px;
　　text-align:center;
　　padding:4px;
　　text-decoration:none;
　　text-transform:uppercase;
　　}
　　a:hover,a:active{
　　background-color:#7A991A;
　　}
　　
　　
　　
　　
　　
　　
　　
　　
　　
　　
　　
　　水平导航栏的样式
　　

　　ul{
　　list-style-type:none;
　　margin:0;
　　padding:0;
　　overflow:hidden;
　　}
　　li{
　　float:left;
　　}
　　a:link,a:visited{
　　display:block;
　　font-weight:bold;
　　免费云主机、域名color:#FFFFFF;
　　background-color:#98bf21;
　　width:120px;
　　text-align:center;
　　padding:4px;
　　text-decoration:none;
　　text-transform:uppercase;
　　}
　　a:hover,a:active{
　　background-color:#7A991A;
　　}
　　
　　
　　
　　
　　
　　
　　
　　
　　
　　
　　

感谢各位的阅读！关于“css如何实现垂直导航栏和水平导航栏”这篇文章就分享到这里了，希望以上内容可以对大家有一定的帮助，让大家可以学到更多知识，如果觉得文章不错，可以把它分享出去让更多的人看到吧！

相关推荐: PS常用工具的快捷键有哪些

本篇内容介绍了“PS常用工具的快捷键有哪些”的有关知识，在实际案例的操作过程中，不少人都会遇到这样的困境，接下来就让小编带领大家学习一下如何处理这些情况吧！希望大家仔细阅读，能够学有所成！“PS常用工具的快捷键有哪些”的内容就介绍到这里了，感谢大家的阅读。如果…