CSS text-align-last 属性

定義と使用方法

text-align-last 属性はテキストの最後の行をどのように揃えるかを定義します。

text-align-last 属性は選択された要素内の全ての最後の行に設定されます。したがって、<div> 内に3つのパラグラフがある場合、text-align-last は各パラグラフの最後の行に適用されます。text-align-last をコンテナの最後のパラグラフに使用するには、:last child を使用してください。以下の例を参照してください。

注釈：Edge/Internet Explorer では、text-align-last 属性は "text-align: justify" が設定されたテキストにのみ適用されます。

も参照してください：

CSS 教程：CSS 文本

HTML DOM リファレンスマニュアル：textAlignLast 属性

例

三つの <div> 要素の最後の行を揃えます：

div.a {
  text-align: justify;  /* 针对 Edge */
  text-align-last: right;
}
div.b {
  text-align: justify; /* Edge用 */ 
  text-align-last: center;
}
div.c {
  text-align: justify; /* Edge用 */ 
  text-align-last: justify;
}

自分で試してみる

ページの下部にTIYの更多例が見つかります。

CSS文法

text-align-last: auto|left|right|center|justify|start|end|initial|inherit;

属性値

値 説明
auto

デフォルト値。各行の揃えルールはtext-alignの値で決定されます。

text-alignの値がjustifyの場合、text-align-lastの表示はstartの設定と同じです。
left 最後の行は左側に揃えます。
right 最後の行は右側に揃えます。
center 最後の行は中央に揃えます。
justify 最後の行の先頭が内容の左側に揃えられ、末尾が右側に揃えます。
start

最後の行は行の先頭に揃えます。

text-directionが左から右の場合は左揃え、text-directionが右から左の場合は右揃えになります。
end

最後の行は行末に揃えます。

text-directionが左から右の場合は右揃え、text-directionが右から左の場合は左揃えになります。
initial この属性はデフォルト値に設定されます。参照してください： initial。
inherit この属性は親要素から継承されます。参照してください： inherit。

技術的詳細

デフォルト値： auto
継承： はい
アニメーション作成： サポートされていません。参照してください：アニメーション関連属性。
バージョン： CSS3
JavaScript文法： object.style.textAlignLast="right"

さらに多くの例

コンテナ内の最後の行にtext-align-lastを適用する

div.b p:last-child {
  text-align-last: center;
}

自分で試してみる

ブラウザのサポート

テーブルの数字は、この属性を完全にサポートする最初のブラウザのバージョンを示しています。

-moz-付きの数字は、プレフィックスを使用する最初のバージョンを示しています。

Chrome IE / Edge Firefox Safari Opera
47.0 5.5* 49.0
12.0 -moz-		 サポートされていません 34.0

* Edge/Internet Explorerでは、"start"と"end"の値はサポートされていません。