text-align-last

Baseline 已廣泛支援

此功能已成熟，並可在多種裝置和瀏覽器版本上執行。自 2022 年 9 月起，所有瀏覽器都已支援此功能。

text-align-last CSS 屬性設定塊或行（在強制換行符之前）的最後一行如何對齊。

試一試

text-align-last: right;

text-align-last: center;

text-align-last: left;

<section id="default-example">
  <div>
    <p id="example-element">
      Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
      aliquip ex ea commodo consequat.
    </p>
  </div>
</section>

section {
  font-size: 1.5em;
}

#default-example > div {
  width: 250px;
}

#example-element {
  text-align: justify;
}

語法

css

/* Keyword values */
text-align-last: auto;
text-align-last: start;
text-align-last: end;
text-align-last: left;
text-align-last: right;
text-align-last: center;
text-align-last: justify;

/* Global values */
text-align-last: inherit;
text-align-last: initial;
text-align-last: revert;
text-align-last: revert-layer;
text-align-last: unset;

值

auto: 受影響的行按照 text-align 的值對齊，除非 text-align 為 justify，在這種情況下，效果與將 text-align-last 設定為 start 相同。
start: 如果方向是從左到右，則與 left 相同；如果方向是從右到左，則與 right 相同。
end: 如果方向是從左到右，則與 right 相同；如果方向是從右到左，則與 left 相同。
left: 行內內容與行框的左邊緣對齊。
right: 行內內容與行框的右邊緣對齊。
center: 行內內容在行框中居中對齊。
justify: 文字兩端對齊。文字的左右邊緣應與段落的左右內容邊緣對齊。

正式定義

初始值	`auto`
應用於	塊容器
繼承性	是
計算值	同指定值
動畫型別	離散

正式語法

text-align-last = 
  auto          |
  start         |
  end           |
  left          |
  right         |
  center        |
  justify       |
  match-parent

示例

最後一行兩端對齊

<p>
  Integer elementum massa at nulla placerat varius. Suspendisse in libero risus,
  in interdum massa. Vestibulum ac leo vitae metus faucibus gravida ac in neque.
  Nullam est eros, suscipit sed dictum quis, accumsan a ligula.
</p>

CSS

css

p {
  font-size: 1.4em;
  text-align: justify;
  text-align-last: center;
}

結果

規範

規範
CSS Text Module Level 3 # text-align-last-property

瀏覽器相容性

另見

text-align

幫助改進 MDN

瞭解如何貢獻

此頁面上次由 MDN 貢獻者在 2025 年 7 月 14 日修改。

在 GitHub 上檢視此頁面 • 報告此內容的問題