Question

我试图在W3验证器上验证我的代码，并且显示错误-- 作用域中没有li元素，但是看到了li end标签。 这是我在引导程序示例中找到的引导程序下拉菜单。

我是否缺少列表元素？

<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>

Answer 1

在以下代码中：

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

您绝对不能将<li>作为自身的直接后代。这是一个主要问题，除此之外，请尝试使所有结束标记正确。 Bootstrap示例已经过完美验证。

Answer 2

您可能正在寻找在子菜单项中另外一个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>

关闭列表元素的正确方法是什么？

2 个答案: