: SPAN 要素

最終更新：2026-09-12

<span>SPAN 要素

<span> 要素は意味を持たない汎用のインラインコンテナーです。テキストの一部をスタイルしたり、改行を発生させずに JavaScript のフックとして使います。

カテゴリ	テキスト内容
コンテンツモデル	フレージングコンテンツ
許可される親要素	フレージングコンテンツを受け入れる要素
閉じタグ	必要 `</span>` タグ
ステータス	標準

📝 構文

<span>インラインコンテンツ</span>

すべてのグローバル属性を見る → すべてのイベント属性を見る →

▶ サンプル

下のコードを編集して、playground でリアルタイム結果を確認：

▶ 試してみる

🌐 ブラウザサポート

ブラウザ	Chrome	Edge	Firefox	Safari	Opera
<span>	✓ v1	✓ v12	✓ v1	✓ v1	✓ v1
すべての主要ブラウザでサポート

❓ よくある質問

Q と

の違いは何ですか？

A<div> はブロックレベル要素（行幅いっぱいを占め、改行される）で、<span> はインライン要素（必要な幅だけを取り、テキストと同じ行に留まる）です。

Q の中にブロック要素を入れられますか？

Aいいえ、<span> はインライン要素なので、<div>、<p>、見出しなどのブロックレベル要素を法的に含むことはできません。ブロックレベルのコンテンツが必要な場合は <div> または意味的コンテナを使用してください。

Q の代わりにや を使うべき時は？

A<em> は強調（意味があり、スクリーンリーダーに影響）、<strong> は強い重要性、<span> は意味なしの汎用インライン CSS フックが必要な場合のみ使用してください。

🏷️ 関連タグ

<div> <p> <strong> <em> <mark>

💡 関連ケース

<span> — elements チュートリアル

📚 関連チュートリアル

HTML Text Formatting HTML Elements HTML Layout

HTML 要素チュートリアル

インライン要素とブロック要素の違いを学ぶ

Web-Tutorial 技術チーム

複数の開発者によって共同維持されているプログラミングチュートリアルプラットフォーム。各チュートリアルは専門分野の開発者が執筆・レビューしています。正確で信頼性の高いコンテンツを目指しています — 問題を見つけた場合はお知らせください。

私たちについて