HTML <span> 标签

HTML <span> 元素是短语内容的通用行内文本容器,并没有任何特殊语义。可以使用它来编组元素以达到某种样式效果(通过使用类或者Id属性),或者这些元素有着共同的属性,比如lang。建议在没有其他合适的语义元素时才使用它。<span> 与 div 元素很相似,但 div 是一个 块元素 而 <span> 则是 行内元素 .


实例
  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  4. <h1>span 元素</h1>
  5. <p>我明确有一双 <span style="color:blue;font-weight:bold">蓝色</span> 眼睛,我父亲有一双<span style="color:darkolivegreen;font-weight:bold">深绿色的</span>眼睛。</p>
  6. </body>
  7. </html>

定义和用法

<span> 标签被用来组合文档中的行内元素。


浏览器支持

元素
<span>YesYesYesYesYes

所有浏览器都支持 <span> 标签。


HTML 与 XHTML 之间的差异


提示和注释:

提示:请使用 <span> 来组合行内元素,以便通过样式来格式化它们。

注释:span 没有固定的格式表现。当对它应用样式时,它才会产生外观上的变化。


例子

  1. <p><span>一些文本。</span>另一些文本。</p>
例子解释

如果不对 span 应用样式,那么 span 元素中的文本与其他文本不会任何视觉上的差异。尽管如此,上例中的 span 元素仍然为 p 元素增加了额外的结构。

可以为 span 加上 id 或 class 属性,这样既可以增加适当的语义,又便于对 span 应用样式。

可以对同一个 <span> 元素应用 class 或 id 属性,但是更常见的情况是只应用其中一种。这两者的主要差异是,class 用于元素组(类似的元素,或者可以理解为某一类元素),而 id 用于标识单独的唯一的元素。


全局属性

<span> 标签支持 HTML 中的 全局属性


事件属性

<span> 标签支持 HTML 中的 事件属性