html - 子菜单的水平滚动动作

Question

我想在移动视图中为我的网站创建一个水平滚动菜单。我从某个地方获得了 CSS 代码，它可以工作，但它仅适用于菜单。所以，我也想要子菜单的 CSS 代码。我怎样才能做到这一点？

下面列出了适用于水平滚动菜单的 CSS 代码：

selector ul{ /* let's set the horizontal layout for our menu */
     white-space: nowrap;
    overflow-x: auto; 
    overflow-y: hidden;
    flex-wrap: inherit !important;
    scrollbar-width: none; /* this will remove scroll-bar for mozilla based browser */
}

selector a{ /* some graphic adjustmend for the A tag */
    background: #161C2E;
    border-radius: 0px;
}

selector ul::-webkit-scrollbar { /* now, let's remove the scroll-bar from the menu */
  display: none; }

标签： htmlcsswordpresshorizontal-scrollingsubmenu

Answer 1

由于 wordpress 中的子菜单通常是ulanother 的内部ul，因此您也可以定位这些元素：

selector ul, selector ul ul { 
    white-space: nowrap;
    overflow-x: auto; 
    overflow-y: hidden;
    flex-wrap: inherit !important;
    scrollbar-width: none;
}