在<li>标签之间放置<h2>标签是否语义上不正确？

Question

我计划做这样的事情：

<ul class="menu">
 <li><h2>Contact</h2></li>
 <li>my email</li>
 <li>my phone</li>
</ul>

这样做是否语义上不正确（或者是不好的实践）？

如果答案是肯定的，那么我应该采取什么替代方案呢？

<ul class="menu">
 <li><strong>Contact</strong></li>
 <li>my email</li>
 <li>my phone</li>
</ul>

由于没有div来组合标题标签，我无法仅放置一个标题标签：

<div id="branding">
<h1>
<ul class="menu">
<ul class="menu">
<ul class="menu serif">
<ul id="lang">
</div>

- alexchenco

---

我不确定我理解你在编辑方面的意思。 - Davy8

你想通过h2标签传达什么信息？这并不是“错误”的，但根据你的意图，它可能会在语义上造成困惑。 - kinakuta

Answer 1

根据W3C验证器的结果，使用<li>标签内部的<h2>标签是完全有效的。这比使用带有样式的<strong>标签更可取，因为它传达了文本的语义意图（并因此有助于SEO）。

- basicxman

Answer 2

为什么要将“联系方式”放在li中呢？这似乎是列表的标题而不是列表的一部分，所以我会这样做：

<h2>Contact</h2>
<ul>
 <li>my email</li>
 <li>my phone</li>
</ul>

- Davy8

---

这是一个旧帖子，但发帖人并不是在问他们应该把<h2>放在哪里。他们在问是否可以在<li>标签内放置它。 - Andrew

Answer 3

是的，它可以用作li是默认的块元素。在块元素下嵌套块元素是有效的，使用标题标签如h2，h3等在li标签内部的方法使代码更易读。以下是一个例子：

<ul class="list-unstyled row">
    <li class="col-md-6">
        <h3>BRANDING AND IDENTITY</h3>
        <p>Quisque rhoncus euismod pulvinar. Nulla non arcu at lectus. Vestibulum velit.</p>
    </li>
    <li class="col-md-6">
        <h3>UI/UX AND GRAPHIC DESIGN</h3>
        <p>Quisque rhoncus euismod pulvinar. Nulla non arcu at lectus. Vestibulum velit.</p>
    </li>
    <li class="col-md-6">
        <h3>MULTIMEDIA PRODUCTION</h3>
        <p>Quisque rhoncus euismod pulvinar. Nulla non arcu at lectus. Vestibulum velit.</p>
    </li>
    <li class="col-md-6">
        <h3>WEB AND SOFTWARE DEVELOPMENT</h3>
        <p>Quisque rhoncus euismod pulvinar. Nulla non arcu at lectus. Vestibulum velit.</p>
    </li>
</ul>

- Jaha Ganiev