我们可以在<h1>标签内添加<span>吗？

Question

在 <h1> 标签内使用 <span> 标签是一种合适的方法吗？

<h1>
    <span class="boardit">Portfolio</span>
</h1>

我知道我们可以用这种方式编写代码......我在自己的网站中也遵循以下语法。

<h1 class="boardit">
  <span>Portfolio</span>
</h1>

然而，我只是想知道HTML的更简洁的形式。

- Codeobsession

---

@fireeyed，我认为他希望遵循正确的方式，即标签的语义。 - kazinix

如果您已经获得所需信息，请不要忘记将答案标记为已接受。 - Pranay Rana

在标题中放置跨度会导致单词换行的问题。有其他人也观察到这个问题吗？ - Rafael

你曾经尝试过包装任何在span中的文本吗？那么，如何包装任何块元素中的文本呢？@Rafael - user5306470

Answer 1

可以的。

HTML4这样说道：

<!ENTITY % heading "H1|H2|H3|H4|H5|H6">
<!--
  There are six levels of headings from H1 (the most important)
  to H6 (the least important).
-->

<!ELEMENT (%heading;)  - - (%inline;)* -- heading -->

而 %inline; 是：

<!ENTITY % inline "#PCDATA | %fontstyle; | %phrase; | %special; | %formctrl;">

和%special;一样，它包括<span>。

当前的HTML这样说:

内容内容
短语内容

和短语内容一样，它包括<span>。

- mu is too short

---

“HTML5 has this to say”的链接已经失效了 :(” - mehulkar

感谢 @mehulkar 告诉我，现在应该已经修复了。 - mu is too short

Answer 2

可以的。可以用它来格式化h1块的一部分：

<h1>Page <span class="highlight">Title</span></h1>

如果样式适用于整个h1块，我会这样做：

<h1 class="highlight">Page Title</h1>

- mnsr

Answer 3

通常情况下，在 h1 标签内使用 span 是没问题的。因为 span 是一个行内元素，所以通常可以在任何允许包含元素的标签内使用它。

有时候，如果您想只样式化 h1 的一部分文本，使用 span 也是比较干净的方法。

不过，如果没必要就不要这样做，因为这样会显得有点丑 : )

- Dave

Answer 4

没问题，但为什么不这样做呢？

   <h1 class="boardit">
      Portfolio
   </h1>

如果你只是做这个的话？

- Simon Sarris

---

这还不够。请求仅对标题的一部分进行样式设置。 - user5306470

Answer 5

可以的。Span 显示为内联，因此不应影响 H1 的样式。

- geetfun

Answer 6

是的，我们可以在标题标签中使用 span 标签，这样做没有任何问题。事实上，这种方法被广泛用于为标题标签添加样式，特别是为了给某个单词或字母着色。

- Touhid Rahman

Answer 7

是的，我们可以在标题标签中使用 span 标签，这样做没有任何问题。事实上，这种方法被广泛用于为标题标签添加样式，特别是为了给某个单词或字母着色。

- Touhid Rahman

Answer 8

<h1 style="display:inline;">Bold text goes here</h1> 
<span style="display:inline;">normal text goes here</span>

从上面的行中思考 - 对我有用 - 使用display:inline属性

- takrishna

---

这与问题有什么关系？ - Quentin

我认为他的意思是建议强制将标题设置为行内元素。如果可行，这是一个好主意。 - user5306470

这个答案解决了问题，虽然它并不是直接被问到的内容，因此不应该被投票下降。对于这个解决方案点赞。 - Achala Dissanayake