<span>

HTML の <span> 要素は、記述コンテンツの汎用的な行内コンテナーであり、何かを表すものではありません。スタイル付けのため (class または id 属性を使用して)、または lang のような属性値を共有したりするために要素をグループ化する用途で使用することができます。他に適切な意味的要素がない時にのみ使用してください。 <span> は <div> 要素ととても似ていますが、 <div> がブロックレベル要素であるのに対し、 <span> はインライン要素です。

試してみましょう

コンテンツカテゴリ	フローコンテンツ, 記述コンテンツ
許可されている内容	記述コンテンツ
タグの省略	不可。開始と終了タグの両方が必要。
許可されている親要素	記述コンテンツを受け入れるすべての要素、またはフローコンテンツを受け入れるすべての要素。
暗黙の ARIA ロール	対応するロールなし
許可されている ARIA ロール	すべて
DOM インターフェイス	`HTMLSpanElement` (HTML5 より前は `HTMLElement`)

HTML

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

結果

例 2

HTML

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

CSS

li span {
  background: gold;
 }

結果

仕様書

仕様書	状態	備考
HTML Living Standard <span> の定義	現行の標準
HTML5 <span> の定義	勧告	DOM インターフェイスを `HTMLSpanElement` に変更
HTML 4.01 Specification <span> の定義	勧告

ブラウザーの互換性

BCD tables only load in the browser

<span>

試してみましょう

属性

例

例 1

HTML

結果

例 2

HTML

CSS

結果

仕様書

ブラウザーの互換性

関連情報