View in EnglishAlways switch to English

<span>：内容跨越元素

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨2015年7月⁩.

<span>HTML 元素是一个通用的行级容器，本身不具备特殊含义。它可被用于对元素进行编组，以便于添加样式（通过使用class 或id 属性），或共享属性值（例如lang 属性）。该元素仅应在无其他合适语义元素时使用。<span> 与<div> 元素非常相似，但是<div> 是块级元素，而<span> 是一个行级元素。

尝试一下

<p>  Add the <span>basil</span>,  <span>pine nuts</span> and  <span>garlic</span> to a blender and blend into a paste.</p><p>  Gradually add the <span>olive oil</span> while running the  blender slowly.</p>

span.ingredient {  color: #f00;}

HTML

html

<p><span>一些文本</span></p>

结果

示例 2

HTML

html

<li>  <span>    <a href="portfolio.html">查看我的作品集</a>  </span></li>

CSS

css

li span {  background: gold;}

结果

技术概要

内容分类	短语内容、流式内容。
允许的内容	短语内容。
标签省略	不允许，开始标签和结束标签都不能省略。
允许的父元素	任何接受短语内容、流式内容的元素。
隐含的 ARIA 角色	没有对应的角色
允许的 ARIA 角色	任意
DOM 接口	`HTMLSpanElement`