少量文本的 <p> 元素在语义上是否正确[关闭]答案

【问题标题】：Is a <p> element for small amounts of text semantically correct [closed]少量文本的 <p> 元素在语义上是否正确[关闭]
【发布时间】：2014-04-10 18:37:16
【问题描述】：

我一直想知道<p> 元素对于少量文本在语义上是否正确。

当我想到一个段落时，我实际上是在想象一大段文字。

在下面的示例中，我使用了<p> 元素来显示用户在注册表单中输入密码的密码强度。

<div class="inputs">
    <div class="field">
        <input id="firstname" type="text" name="firstname" placeholder="First" />
        <input id="lastname" type="text" name="lastname" placeholder="Last" />
    </div>
    <div class="field">
        <input id="email" type="email" name="email" />
    </div>
    <div class="field">
        <input id="email-confirm" type="email" name="email" autocomplete="off" />
    </div>
    <div class="field">
        <input id="password" type="password" name="password" />
        <p>Password strength: Weak</p>
    </div>
</div>

【问题讨论】：

p 用于段落...使用span
<p> 用于段落，小文本最好使用<span> 元素
注意：这个问题似乎并不完全离题，但是，我推荐Pro Webmasters.SE 用于以后的类似问题。
“标签”这个词在语义上是不正确的。
HTML 规范对p 元素的“含义”含糊不清。此外，作为一个段落实际上是结构问题，而不是含义；意义（即语义）与实际内容所说的内容有关。所以这在很大程度上是一个意见问题。

标签： html semantics

【解决方案1】：

HTML5 规范是这么说的

段落通常是一系列形成块的短语内容包含一个或多个讨论特定主题的句子的文本，如在排版中，但也可用于更一般的主题分组。例如，地址也是一个段落，就像一个部分一样形式、署名或诗节。

还有

注意：虽然段落通常在视觉媒体中表示为与相邻块物理分离的文本块通过空白行，样式表或用户代理将同样有理由以不同的方式呈现段落分隔符，因为使用内联 pilcrows (¶) 的实例。

从上面可以得出的唯一结论是，这不是<p> 的语义正确用法，因为它没有将任何东西组合在一起。

在这种情况下使用语义中性的<span> 或者更具体的名称（例如<label>）会更合适。

另一方面，<div class="field"> 元素用于对控件进行分组并在视觉上分隔相邻的组，因此将 <div> 替换为 <p> 在语义上是合适的。

【讨论】：

【解决方案2】：

有不同的意见，但我总是使用<p> 来表示所有相互关联的文本内容块。这一般是一个段落，但没有什么说它不能是一个短段落。如果你有几个句子在一起，使用段落标签就可以了。

在您的<p>Password strength: Weak</p> 示例中，我认为<label> 或<dd> 更合适，因为您将该数据与<input> 字段相关联。

【讨论】：

如果你在这里使用dd，你就是在滥用列表。关于密码强度的输入和备注不构成列表！
@MrLister 我不一定不同意，但我认为它比<p>更好。