css下拉菜单怎么做?

2024-01-17 16:41 小编
  HTML代码:
 
  
 
  <ul>
 
  <ahref="#">水果</a>
 
  <ul>
 
  <li><ahref="#">苹果</a></li>
 
  <li><ahref="#">香蕉</a></li>
 
  <li><ahref="#">草莓</a></li>
 
  </ul>
 
  </ul>
 
  <ul>
 
  <ahref="#">甜点</a>
 
  <ul>
 
  <li><ahref="#">蛋糕</a></li>
 
  <li><ahref="#">曲奇</a></li>
 
  <li><ahref="#">面包</a></li>
 
  </ul>
 
  </ul>
 
  <ul>
 
  <ahref="#">奶茶</a>
 
  <ul>
 
  <li><ahref="#">红豆奶茶</a></li>
 
  <li><ahref="#">珍珠奶茶</a></li>
 
  <li><ahref="#">全套奶茶</a></li>
 
  </ul>
 
  </ul>
 
  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;
 
  }






Tag: 怎么
在线咨询 拨打电话

电话

13363039260

微信二维码

微信二维码