CSS text-align-last 属性

定义和用法

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

请注意,text-align-last 属性设置的是被选元素内的所有最末行。所以,如果一个 <div> 中有三个段落,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" 值。