text-align-last プロパティ
最終更新:2026-09-13
text-align-last text-align-last プロパティ
text-align-last プロパティは、ブロックレベル要素内の最終行の配置を設定します。多くは text-align: justify と組み合わせて使われます。既定では text-align の配置規則は段落の最終行には適用されませんが、text-align-last を使えば最終行だけを個別に制御でき、両端揃えのレイアウトをより柔軟で美しくできます。
| カテゴリ | |
|---|---|
| 初期値 | auto |
| 継承 | はい |
| 適用対象 | |
| アニメーションタイプ | |
| CSS バージョン | CSS3 |
| 状態 | 標準 |
📝 構文
text-align-last: auto | start | end | left | right | center | justify;
⚙️ 値
| 値 | タイプ | 説明 |
|---|---|---|
auto | start | end | left | right | center | justify | キーワード | 最終行の配置値 |
▶ 例
以下のコードを編集して、プレイグラウンドでライブ結果を確認してください:
🌐 ブラウザーサポート
| ブラウザー | |||||
|---|---|---|---|---|---|
| text-align-last | ✓ v43 | ✓ v12 | ✓ v49 | ✓ v9 | ✓ v30 |
| すべての主要ブラウザーでサポート | |||||
ヒント: auto は、最終行の配置が text-align の値に従うことを意味します。text-align が justify の場合、最終行は左揃えになります。
注意: text-align-last は、要素に複数行のテキストがある場合にのみ効果が見えます。单行では変化しません。
❓ よくある質問
Qtext-align-last と text-align の関係は?
Atext-align は最終行以外のすべての行の配置を制御し、text-align-last は最終行の配置だけを制御します。両者を組み合わせると、ブロック内のタイポグラフィをより細かく制御できます。
Qtext-align-last が期待通りに動かないのはなぜですか?
A要素に複数行のテキストがあるか、text-align が justify に設定されているかを確認してください。テキストが一行だけなら、text-align-last は可視的な効果を生みません。
Q段落の最終行を中央揃えにするには?
Aまず text-align: justify で全体を両端揃えにし、次に text-align-last: center で最終行だけを中央揃えにします。複数行テキストでのみ機能することに注意してください。单行なら text-align: center を直接使用してください。