多级列表样式技巧（一）

最新推荐文章于 2024-08-19 14:06:28 发布

daisyliys

最新推荐文章于 2024-08-19 14:06:28 发布

阅读量2.3k

点赞数

分类专栏：导航样式前端

本文链接：https://blog.csdn.net/daisyliys/article/details/50405113

版权

本文介绍了一种实现一级列表横向多排且自适应的技巧，点击一级列表后会弹出覆盖其上的二级列表。二级列表在垂直方向上随动，而水平方向保持固定。

摘要由CSDN通过智能技术生成

描述：一级列表为横向多排自适应列表，点击一级列表上面覆盖二级列表，垂直方向随动，水平方向固定。

<!--同级列表下级菜单显示在水平同一位置-->
<ul class="first">
  <li><a>上衣</a></li>
  <li><a>裤子</a></li>
  <li><a>鞋子</a></li>
  <li><a>运动装</a></li>
  <li><a>品牌</a></li>
  <li><a>女装</a></li>
  <li class="active"><a>男装</a>
    <ul class="second">
      <li><a>衬衫</a></li>
      <li><a>背心</a></li>
      <li><a>西装</a></li>
      <li><a>运动服</a></li>
      <li><a>西装</a></li&