text-indent（先頭行のインデント）プロパティ

最終更新：2026-09-13

text-indent text-indent（先頭行のインデント）プロパティ

text-indent プロパティはブロックレベル要素の先頭行の水平方向の字下げを設定します。段落の先頭行の字下げによく使われます。最初の行にだけ影響します。値には固定長（2em など）や包含ブロックの幅に対するパーセントが使え、負の値でぶら下げインデントを作ります。

text-indent: <length> | <percentage>;

値	タイプ	説明
`<length>`	タイプ	固定の先頭行の字下げ
`<percentage>`	タイプ	包含ブロックの幅に対するパーセント

以下のコードを編集して、プレイグラウンドでライブ結果を確認してください：

ブラウザー	Chrome	Edge	Firefox	Safari	Opera
text-indent	✓ v1	✓ v12	✓ v1	✓ v1	✓ v1
すべての主要ブラウザーでサポート

ヒント： 中国語の組版では、先頭行の 2 文字分の字下げの標準は 2em です。em 単位はフォントサイズに応じて自動的に拡縮します。

注意： text-indent はブロックレベル要素にのみ適用されます。span のようなインライン要素は字下げされません。

Qtext-indent のパーセント値はどの幅に対するものですか？

A要素の包含ブロック（親）のコンテンツ幅に対するもので、自身の幅やフォントサイズではありません。たとえば親が 400px の場合、text-indent: 10% は先頭行を 40px 字下げします。一方 em 単位は現在の要素のフォントサイズに対するものです。

Qtext-indent を他の字下げ手法と組み合わせられますか？

Aはい。text-indent は先頭行にしか影響しないため、padding-left と組み合わせると段落全体を字下げできます。負の値と padding-left を組み合わせると、先頭行が左にはみ出すぶら下げインデントになります。両手法は競合しません。

Q段落の先頭行を 2 文字分字下げするにはどうすればよいですか？

A中国語組版の標準は text-indent: 2em です。em は現在のフォントサイズに対するものなので、字下げはサイズに自動的に追随し、常に 2 文字分の幅になります。固定 px 値は避けてください。フォントサイズが変わると比率が崩れます。

Web-Tutorial 技術チーム

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