<span>:内容 span 元素

Baseline 已广泛支持

此特性已相当成熟,可在许多设备和浏览器版本上使用。自 ⁨2015 年 7 月⁩以来,各浏览器均已提供此特性。

<span> HTML 元素是一个通用的行内容器,用于放置短语内容,它本身不代表任何特定内容。它可以用于将元素分组以进行样式设置(使用 classid 属性),或者因为它共享属性值(例如 lang)。只有在没有其他语义元素合适时才应使用它。<span> 元素非常类似于 <div> 元素,但 <div> 是一个块级元素,而 <span> 是一个行内元素

试一试

<p>
  Add the <span class="ingredient">basil</span>,
  <span class="ingredient">pine nuts</span> and
  <span class="ingredient">garlic</span> to a blender and blend into a paste.
</p>

<p>
  Gradually add the <span class="ingredient">olive oil</span> while running the
  blender slowly.
</p>
span.ingredient {
  color: red;
}

属性

此元素仅包含全局属性

示例

示例 1

HTML

html
<p><span>Some text</span></p>

结果

示例 2

HTML

html
<li>
  <span>
    <a href="portfolio.html" target="_blank">See my portfolio</a>
  </span>
</li>

CSS

css
li span {
  background: gold;
}

结果

技术摘要

内容类别 流内容短语内容
允许内容 短语内容.
标签省略 无,起始标签和结束标签都必须存在。
允许父级 任何接受短语内容的元素,或任何接受流内容的元素。
隐式 ARIA 角色 没有对应的角色
允许的 ARIA 角色 任意
DOM 接口 HTMLSpanElement

规范

规范
HTML
# the-span-element

浏览器兼容性

另见