Question

在下面的代码中我有一个ul标签内的div用于制作可折叠的dropdown。但是它抛出div不能嵌套在ul里面而且li不能嵌套在div里面.Pls帮助我解决问题。

<li visible="false" runat="server" id="liMasters">
 <ul>
  <li class="heading accounts">
  <asp:Label ID="lblMasters" Visible="false" runat="server"></asp:Label></li>
   <div class="menu-item">
    <li>
      <div class="nav-item" id="SalesPrice" visible="false" runat="server">
          <a href="/Hoard/SalesPrice.aspx" id="SalesPriceUL">
          <asp:Label ID="lblSalesPrice" runat="server"></asp:Label></a>
      </div>
    </li>
   </div>
 </ul>
</li>

Answer 1

从<ul>标记开始的无序或有序列表只能包含列表项（<li>标记）。 <li>标签本身可以再次包含不同的元素，例如。 <a>代码。

有关详细信息，请参阅http://www.w3.org/TR/html5/grouping-content.html#the-ul-element。

Answer 2

HTML <ul>标记   定义和用法
  标签定义了无序（项目符号）列表   将<ul>标记与<li>标记一起使用以创建无序列表。

Reference from w3schools

如果您愿意，可以在<div>代码中插入<li>代码，这样会很好。

Answer 3

改为li为display: block，它将像<div>一样行事。然后做各种各样的事情。

<li visible="false" runat="server" id="liMasters">
  <ul>
    <li class="heading accounts">
      <asp:Label ID="lblMasters" Visible="false" runat="server"></asp:Label>
    </li>
      <li style="display: block" class="menu-item">
        <div class="nav-item" id="SalesPrice" visible="false" runat="server">
          <a href="/Hoard/SalesPrice.aspx" id="SalesPriceUL">
            <asp:Label ID="lblSalesPrice" runat="server"></asp:Label>
          </a>
        </div>
      </li>
  </ul>
</li>

Answer 4

这是一个合理的解决方案：

<li visible="false" runat="server" id="litMasters">
  <ul>
    <li class="heading accounts">
      <asp:Literal ID="litMasters" Visible="false" runat="server"></asp:Literal>
    </li>
    <li class="menu-item nav-item">
      <a href="/Hoard/SalesPrice.aspx" id="SalesPriceUL">
        <asp:Literal ID="litSalesPrice" runat="server"></asp:Literal>
      </a>
    </li>
  </ul>
</li>

所有标签都更改为文字。

Answer 5

将您的doctype更改为

<!doctype html>

对于HTML5，它广泛支持嵌套元素内嵌元素

或

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
   <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

适用于HTML4及以下版本。

至少在HTML5中允许在li，ul和dl中嵌套div。

Div不能嵌套在ul里面，li也不能嵌套在div里面

5 个答案: