是否可以在物化中制作嵌套下拉菜单？第二个下拉菜单应该位于右侧
<a class='dropdown-button btn' href='#' data-activates='dropdown1' data-beloworigin="true">Drop Me!</a>
<ul id='dropdown1' class='dropdown-content'>
<li><a class='dropdown-button d' href='#' data-activates='dropdown2' data-hover="hover" data-alignment="right">Drop Me!</a></li>
<li><a href="#!">two</a></li>
<li><a href="#!">three</a></li>
</ul>
<ul id='dropdown2' class='dropdown-content'>
<li><a href="#!">second one</a></li>
<li><a href="#!">second two</a></li>
<li><a href="#!">second three</a></li>
</ul>
https://jsfiddle.net/m0sdcn6e/
这样的嵌套是行不通的。有任何想法吗？
谢谢阿尔伯特·M。
这不是最好的解决方案，但这就是我得到的：
只需将其添加到您的 CSS 文件中：
.dropdown-content {
overflow-y: visible;
}
.dropdown-content .dropdown-content {
margin-left: 100%;
}
这就是我用来从 Materializecss 框架获取嵌套下拉菜单的方法，因为他们还没有本地实现它。
例子：https://jsfiddle.net/m0sdcn6e/15/
UPDATE:
不幸的是，这种方法有一个问题。根据定义，overflow(x 或 y) 属性控制当容器超出其大小时会发生什么情况。默认值为overflow-y is auto，因此，例如，如果某些内容超出了下拉列表的大小，它将变得可滚动。
默认情况下，Materializecss 在其父项中生成下拉列表的内容，因此如果我们不将overflow-y visible，嵌套下拉菜单将消失。但是使用该方法，虽然嵌套下拉菜单工作得很好，但这些下拉菜单将变得不可滚动。
为避免非嵌套下拉菜单出现问题，您可以采取的方法是重命名第一个类，并仅在需要附加嵌套下拉菜单时才使用它。
.dropdown-content.nested {
overflow-y: visible;
}
例子：https://jsfiddle.net/m0sdcn6e/16/
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
