我们可以在H1标签内添加<span>吗?


96

在H1标签内使用span标签是否合适?

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

我知道我们可以用这种方式编写它...并且还在我自己的网站中遵循以下语法。

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

但是,我只是想知道html的简洁形式。


3
@fireeyed我认为他想遵循正确的意思,即我所指标签的语义。
民进党

2
如果您获得了想要的信息,请不要忘记将答案标记为有效
Pranay Rana

将跨度放在标题中会出现自动换行的问题。还有其他人观察到吗?
拉斐尔

1
曾经尝试包装任何跨度的文本吗?那么包装任何块元素中的文本又如何呢?@Rafael
Daniel Springer

Answers:


180

是的你可以。

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>


1
来自“ HTML5有话要说”的链接已断开:(
mehulkar,

@mehulkar感谢您告诉我,现在应该修复。
亩太短了

29

是的你可以。它可以用于格式化h1块的一部分:

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

如果样式适用于整个h1块,我可以这样做:

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

1
@dpp为什么应该避免使用表象名称?
nu everest 2014年

3

是的,这是典型的精细使用span的内部h1span是一个内联元素,因此通常可以在任何内容中使用它(允许其中包含元素!)

有时候,确实没有一种更干净的方法可以做到,例如,如果您只想对的一部分进行样式设置h1

另一方面...如果没有必要,请不要这样做,因为它有点难看:)



1

是的你可以。跨度显示为内联,因此不会影响H1的样式。


0

是的,我们可以将span标签与header标签一起使用,并且没有任何错误。实际上,这已广泛用于标头标签的样式,特别是用于为特定单词或字母着色。


0

是的,我们可以将span标签与header标签一起使用,并且没有任何错误。实际上,这已广泛用于标头标签的样式,特别是用于为特定单词或字母着色。


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

考虑以上几点-对我有用-使用display:inline prop


这与问题有什么关系?
昆汀

3
@Quentin我相信他的意思是建议强迫标题成为内联元素。一个好主意,如果可行的话。
Daniel Springer

2
尽管这不是直接提出的问题,但它不应解决该问题,因为它可以解决问题。+1为解决方案。
Achala Dissanayake
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.