码农教程 - 一技在手,衣食无忧! tools

目录

CSS text-align-last 属性

❮上一节 完整的CSS参考 下一节❯

示例

对齐三个 <div> 元素中的最后一行文本：

div.a {
  text-align: justify;  /* For Edge */
  text-align-last: right;
}

div.b {
  text-align: justify; /* For Edge */
  text-align-last: center;
}

div.c {
  text-align: justify; /* For Edge */
  text-align-last: justify;
}
亲自试一试 »

下面有更多 "亲自试一试" 示例。

定义和用法

这个text-align-last属性指定如何对齐文本的最后一行。

请注意，text-align-last属性设置所选元素内所有最后一行的对齐方式。因此，如果您有一个包含三个段落的 <div>，text-align-last将适用于每个段落的最后一行。使用text-align-last仅在容器中的最后一段，您可以使用 :last child，请参见下面的示例。

笔记：在 Edge 79 之前，text-align-last属性仅适用于具有 "text-align: justify" 的文本。

展示演示❯

默认值： 汽车
遗传： 是的
可动画： 不。阅读可动画的
版本： CSS3
JavaScript 语法： 对象.style.textAlignLast="right"尝试一下

浏览器支持

表中的数字指定完全支持该属性的第一个浏览器版本。

后跟 -moz- 的数字指定使用前缀的第一个版本。

Property
text-align-last 47.0 5.5* 49.0
12.0 -moz-		 Not supported 34.0

*在 Internet Explorer 11（及更早版本）中，不支持 "start" 和 "end" 值。

CSS 语法

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

属性值

Value Description Play it
auto Default value. The last line is justified and aligned left Demo ❯
left The last line is aligned to the left Demo ❯
right The last line is aligned to the right Demo ❯
center The last line is center-aligned Demo ❯
justify The last line is justified as the rest of the lines Demo ❯
start The last line is aligned at the beginning of the line (left if the text-direction is left-to-right, and right is the text-direction is right-to-left) Demo ❯
end The last line is aligned at the end of the line (right if the text-direction is left-to-right, and left is the text-direction is right-to-left) Demo ❯
initial Sets this property to its default value. Read about initial
inherit Inherits this property from its parent element. Read about inherit

更多示例

示例

仅在容器中的最后一行使用 text-align-last ：

div.b p:last-child {
  text-align-last: center;
}
亲自试一试 »

相关页面

CSS教程：CSS 文本对齐

HTML DOM 参考：textAlignLast 属性


❮上一节 完整的CSS参考 下一节❯