【问题标题】:What is correct way of closing list elements?关闭列表元素的正确方法是什么?
【发布时间】:2019-01-23 03:42:51
【问题描述】:

我尝试在 W3 验证器上验证我的代码并显示错误,例如 - 范围内没有 li 元素,但看到了 li 结束标记。 这是我在引导示例中找到的引导下拉菜单。

我是否遗漏了有关列表元素的某些内容?

<li class="menu-open">
                <a href="#" class="drop-width dropdown-toggle" data-toggle="dropdown">Collections</a>
                <ul class="drop-menu dropdown-menu">
                    <li class="drop-menu dropdown-submenu">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">2014</a>
                        <ul class="drop-menu dropdown-menu">
                            <li class="dropdown-submenu">
                                            <li><a href="#">2014</a></li>
                                            <li><a href="#">2013</a></li>
                                            <li><a href="#">2012</a></li>
                                            <li><a href="#">2011</a></li>
                            </li>
                        </ul>
                    </li>
                    <li class="drop-menu dropdown-submenu">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">2014</a>
                        <ul class="drop-menu dropdown-menu">
                            <li class="drop-menu dropdown-submenu">
                                            <li><a href="#">2014</a></li>
                                            <li><a href="#">2013</a></li>
                                            <li><a href="#">2012</a></li>
                                            <li><a href="#">2011</a></li>
                            </li>
                        </ul>
                    </li>
                    <li class="drop-menu dropdown-submenu">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">2014</a>
                        <ul class="drop-menu dropdown-menu">
                            <li class="dropdown-submenu">
                                            <li><a href="#">2014</a></li>
                                            <li><a href="#">2013</a></li>
                                            <li><a href="#">2012</a></li>
                                            <li><a href="#">2011</a></li>
                            </li>
                        </ul>
                    </li>
                </ul>
            </li>

【问题讨论】:

  • 你有
  • 作为父母
  • 的孩子

标签: html bootstrap-4


【解决方案1】:

您可能希望在子菜单项中添加另一个 ul

<ul class="drop-menu dropdown-menu">
    <li class="dropdown-submenu">
        <ul>
            <li><a href="#">2014</a></li>
            <li><a href="#">2013</a></li>
            <li><a href="#">2012</a></li>
            <li><a href="#">2011</a></li>
        </ul>
    </li>
</ul>

【讨论】:

  • @Krizs 我先回答了这个问题!无论如何...很高兴你解决了。
【解决方案2】:

在以下代码中:

<li class="drop-menu dropdown-submenu">
    <li><a href="#">2014</a></li>
    <li><a href="#">2013</a></li>

你绝对不能将&lt;li&gt; 作为它自己的直系后代。这是一个主要问题,除此之外,请尝试正确设置所有结束标签。 Bootstrap 示例已经过完美验证。

【讨论】:

    猜你喜欢
    相关资源
    最近更新 更多
    热门标签