允许的子元素为ul

Question

我正在维护一个遗留应用程序并遇到以下代码:

<ul>
   <li>...</li>
   <li>...</li>
   <li>...</li>
   <li>...</li>
   <li>...</li>
   <div>
      <li>...</li>
      <li>...</li>
   </div>
</ul>

我以前从未将div标签视为元素的子元素ul.HTML在浏览器中渲染得很好.

这是有效的HTML吗？我的直觉是,这是一种奇怪的用法.但是,也许这是完全正常和有效的？是否在div元素内嵌套ul元素适当的用法？你会建议支持还是反对这个？

Answer 1

它在任何版本的HTML中都无效,请参阅例如HTML 4.01ul.

然而,浏览器允许它,并解析它,使其div成为一个孩子ul,他们也让你的风格div.这可能是使用此标记的原因.

Answer 2

HTML 无序列表元素(<ul>)表示无序的项目列表,即没有数字排序的项目集合,它们在列表中的顺序毫无意义.通常,无序列表项目显示有子弹,子弹可以是几种形式,如点,圆或平方.子弹样式未在页面的HTML描述中定义,而是在其关联的CSS中使用list-style-type属性定义.

允许的内容

零个或多个<li>元件,最终与混合<ol>和<ul>元件.

用法示例:

<ul>
  <li>first item</li>
  <li>second item</li>
  <li>third item</li>
</ul>

您可以像这样使用<div>内部<li>标记:

<ul>
  <li>first item</li>
  <li>second item</li>
  <li>
      third item
      <div>Third Item Contente</div>
  </li>
</ul>

Answer 3

您可以使用http://validator.w3.org/进行检查.
错误:
1.document类型不允许元素"DIV"在这里; 假设缺少"LI"开始标记
2.document类型不允许元素"LI"在这里; 缺少"UL","OL"开始标记之一

The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element.  

One possible cause for this message is that you have attempted to put a block-level element (such as "<p>" or "<table>") inside an inline element (such as "<a>", "<span>", or "<font>").