将段落元素放在HTML5的标头标记中可以吗?
换句话说:此标记在HTML5中正确吗?使用此功能有什么缺点?
<h1> <p class="major">Major part</p> <p class="minor">Minor part</p> </h1>
如果没有,如何使用CSS正确设置此元素的样式?
其实没有 根据W3C,此标记不正确。您应该避免使用它。
可以说,标题元素的正确内容是“ 短语内容 ”,即 与常规字符数据混合的 短语元素 。
换句话说,您可以在HTML5的标头标记内使用以下便捷元素: a,em,strong,code,cite,span,br,img 。在这里查看完整列表。
如果您尝试验证此标记,则W3C验证器将给您以下错误: 在这种情况下,元素p不允许作为元素h1的子元素。
您应该考虑的使用此标记的一个主要缺点是,搜索引擎可能会错误地解析您的标题标记并丢失重要数据。因此,这种做法可能对SEO不利。
如果您希望获得更好的SEO结果,则最好在标题元素内仅包含文本数据。但是,如果您还需要应用某些样式,则可以使用以下标记和CSS:
<h1> <span class="major">Major part</span> <span class="minor">Minor part</span> </h1> <style type="text/css"> h1 span { display: block; } h1 span.major { font-size: 50px; font-weight: bold; } h1 span.minor { font-size: 30px; font-style: italic; } </style>
如前所述, span 标签在标头元素(h1-h6)内完全有效。您可以对其应用“ display:block; ”样式,使其呈现为块级元素(每个元素都在另一行上)。它将为您节省一个 br 标签。
当然,您需要根据用例更改此CSS选择器。
是的,正如@stUrb所说,在标题内使用段落在语义上是不正确的。HTML背后最重要的想法是,它必须首先是 语义,然后是表示 。