css 下拉菜单 迈不过友情╰ 2021-09-30 00:44 398阅读 0赞 <style type="text/css"> \* \{ margin: 0px; padding: 0px; list-style: none; \} .top-container\{width:100%; height:70px; background-color: \#909;\} .top1\{width:80%; height:70px; background-color: \#F00; margin:0px auto;\} .top2\{width:25%; max-height:70px; background-color:\#0F0; float:left; text-align:center; line-height: 80px; overflow: hidden; \} .top2:hover\{ background-color: \#F00; max-height: 400px; transition: 0.5s;\} .top2 li:hover\{background-color: \#090;\} </style> <body> <div class="top-container"> <div class="top1"> <div class="top2">花 <ul> <li>水仙</li> <li>牡丹</li> <li>百合</li> <li>玫瑰</li> </ul> </div> <div class="top2">水果 <ul> <li>苹果</li> <li>草莓</li> <li>香蕉</li> <li>西瓜</li> </ul> </div> <div class="top2">蔬菜 <ul> <li>白菜</li> <li>土豆</li> <li>萝卜</li> <li>青菜</li> </ul> </div> <div class="top2">服装 <ul> <li>外套</li> <li>毛衣</li> <li>裤子</li> <li>衬衣</li> </ul> </div> </div> </div> 转载于:https://www.cnblogs.com/Liangbingbing/p/6628991.html
还没有评论,来说两句吧...