小编Tom*_*der的帖子

这一直困扰着我一段时间,我想知道如何正确地做到这一点是否有任何共识.当我使用HTML列表时,我如何在语义上包含列表的标题？

一种选择是这样的:

<h3>Fruits I Like:</h3>
<ul>
    <li>Apples</li>
    <li>Bananas</li>
    <li>Oranges</li>
</ul>

但在语义上,<h3>标题没有明确地与<ul>

另一种选择是:

<ul>
    <li><h3>Fruits I Like:</h3></li>
    <li>Apples</li>
    <li>Bananas</li>
    <li>Oranges</li>
</ul>

但这似乎有点脏,因为标题实际上不是列表项之一.

W3C不允许此选项:

<ul>
    <h3>Fruits I Like:</h3>
    <li>Apples</li>
    <li>Bananas</li>
    <li>Oranges</li>
</ul>

如<ul>'s只能含有一种或多种<li>的

旧的"列表标题" <lh>最有意义

<ul>
    <lh>Fruits I Like:</lh>
    <li>Apples</li>
    <li>Bananas</li>
    <li>Oranges</li>
</ul>

但当然它不是HTML的正式组成部分

我听说它表明我们使用<label>的形式如下:

<ul>
    <label>Fruits I Like:</label>
    <li>Apples</li>
    <li>Bananas</li>
    <li>Oranges</li>
</ul>

但这有点奇怪,无论如何都不会验证.

在尝试设置我的列表标题时,很容易看到语义问题,我最终需要将我的<h3>标记放在第一个标记中,<li>并将其定位为样式,如下所示:

ul li:first-of-type {
    list-style: none;
    margin-left: -1em;
    /*some other header styles*/
}

恐怖!但至少通过这种方式,我可以 …