css如何实现下拉菜单

这篇文章主要为大家展示了"css如何实现下拉菜单"，内容简而易懂，条理清晰，希望能够帮助大家解决疑惑，下面让小编带领大家一起研究并学习一下"css如何实现下拉菜单"这篇文章吧。

　　HTML代码：

　　水果

　　

　　

• 苹果

　　

• 香蕉

　　

• 草莓

　　

　　

　　甜点

　　

　　

• 蛋糕

　　

• 曲奇

　　

• 面包

　　

　　

　　奶茶

　　

　　

• 红豆奶茶

　　

• 珍珠奶茶

　　

• 全套奶茶

　　

　　

　　CSS代码：

　　*{

　　padding:0;

　　margin:0;

　　}

　　ul,a{

　　font-size:20px;

　　list-style:none;

　　text-decoration:none;

　　background-color:#3C3C3C;

　　color:#FFFFFF;

　　width:100px;

　　text-align:center;

　　border:0pxsolidblack;

　　border-radius:5px;

　　margin-top:1px;

　　}

　　a{

　　display:block;

　　}

　　.plat{

　　display:none;

　　}

　　.nav{

　　float:left;

　　margin-left:1px;

　　}

　　.nav:hover.plat{

　　display:block;

　　clear:both;

　　}

　　.platli:hover>a{

　　background-color:dimgrey;

　　}

以上是"css如何实现下拉菜单"这篇文章的所有内容，感谢各位的阅读！相信大家都有了一定的了解，希望分享的内容对大家有所帮助，如果还想学习更多知识，欢迎关注行业资讯频道！