Question

我尝试使用html / css创建一个下拉菜单。菜单看起来不错，但验证员告诉我：

在此上下文中，元素ul不允许作为元素ul的子元素

这是为什么？还有另一种（更好的）方法吗？我的代码如下所示：

          <ul id="meny">
            <li>Svenska</li>
                <ul class="undermeny">
                    <li><a href="om_spelet.html#Spel1">Spel 1</a></li>
                    <li><a href="om_spelet.html#Spel2">Spel 2</a></li>
                    <li>Spel 3</li>
                </ul>
            <li>Matematik</li>
                <ul class="undermeny">
                    <li>spel 1</li>
                    <li>Spel 2</li>
                    <li>Spel 3</li>
                </ul>
            <li>Engelska</li>
                <ul class="undermeny">
                    <li>spel 1</li>
                    <li>Spel 2</li>
                    <li>Spel 3</li>
                </ul>
            <li>NO</li>
                <ul class="undermeny">
                    <li><a href="om_spelet.html#No_Spel1">Spel 1</a></li>
                    <li>Spel 2</li>
                    <li>Spel 3</li>
                </ul>
            <li>SO</li>
                <ul class="undermeny">
                    <li>spel 1</li>
                    <li>Spel 2</li>
                    <li>Spel 3</li>
                </ul>
        </ul>

Answer 1

只有列表项可能是列表元素的子项。

逻辑上，子列表构成了＆＃34;标题＆＃34;列出项目。将它们移到里面。

意思是，正确的语法应该是：

<ul id="meny">
  <li>Svenska
      <ul class="undermeny">
          <li><a href="om_spelet.html#Spel1">Spel 1</a></li>
          <li><a href="om_spelet.html#Spel2">Spel 2</a></li>
          <li>Spel 3</li>
      </ul>
  </li>
  ....
</ul>

Answer 2

如错误所示，您不能将ul作为另一个ul的直接后裔。解决方案是将孩子ul包裹在每个li中。

<ul id="meny">
    <li>Svenska
        <ul class="undermeny">
            <li><a href="om_spelet.html#Spel1">Spel 1</a></li>
            <li><a href="om_spelet.html#Spel2">Spel 2</a></li>
            <li>Spel 3</li>
        </ul>
    </li>
    <li>Matematik
        <ul class="undermeny">
            <li>spel 1</li>
            <li>Spel 2</li>
            <li>Spel 3</li>
        </ul>
    </li>
    <li>Engelska
        <ul class="undermeny">
            <li>spel 1</li>
            <li>Spel 2</li>
            <li>Spel 3</li>
        </ul>
    </li>
    <li>NO
        <ul class="undermeny">
            <li><a href="om_spelet.html#No_Spel1">Spel 1</a></li>
            <li>Spel 2</li>
            <li>Spel 3</li>
        </ul>
    </li>
    <li>SO
        <ul class="undermeny">
            <li>spel 1</li>
            <li>Spel 2</li>
            <li>Spel 3</li>
        </ul>
    </li>
</ul>

为什么我的下拉菜单没有验证器？

2 个答案: