这个HTML结构是否有效? UL> DIV> {LI,LI},DIV> {LI,LI},DIV> {LI,LI}

前端之家收集整理的这篇文章主要介绍了这个HTML结构是否有效? UL> DIV> {LI,LI},DIV> {LI,LI},DIV> {LI,LI}前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
这个 HTML结构是否有效?
<ul class="blog-category">
  <div class="three column">
    <li>Item 1</li> 
    <li>Item 2</li> 
    <li>Item 3</li> 
  </div>
  <div class="three column">
    <li>Item 4</li> 
    <li>Item 5</li> 
    <li>Item 6</li> 
  </div>
  <div class="three column">
    <li>Item 7</li> 
    <li>Item 8</li> 
    <li>Item 9</li> 
  </div>
</ul>

我正在插入里面的div里面的ul.你怎么看?这个结构在语义上是有效的,将被认为是一个单一的列表吗?

解决方法

不,div不允许作为ul的直接孩子.每当你有疑问,validate your page with W3C或检查 the corresponding article on W3C

4.5.6 The ul element

Categories
07002.

Contexts in which this element can be used:
Where 07003 is expected.

Content model:
Zero or more li elements.

Content attributes:
07004

DOM interface:
interface HTMLUListElement : HTMLElement {};

相反,你可以使用

<ul class="blog-category">
    <li class="three column">
        <ul>
            <li>Item 1</li>
            <li>Item 2</li>
            <li>Item 3</li>
        </ul>
    </li>
    <li class="three column">
        <ul>
            <li>Item 4</li>
            ...
        </ul>
    </li>
</ul>

猜你在找的HTML相关文章