CSS 文本对齐
文本对齐和文本方向
在本章中,您将学习以下属性
text-align
text-align-last
direction
unicode-bidi
vertical-align
文本对齐
text-align
属性用于设置文本的水平对齐方式。
文本可以左对齐、右对齐、居中对齐或两端对齐。
以下示例显示了居中对齐、左对齐和右对齐的文本(如果文本方向是从左到右,则默认左对齐;如果文本方向是从右到左,则默认右对齐)
当 text-align
属性设置为 "justify" 时,每一行都会被拉伸,使得每一行宽度相等,左右边距都是直的(就像杂志和报纸一样)
文本末行对齐
text-align-last
属性指定文本的最后一行如何对齐。
示例
对齐三个 <p> 元素中的最后一行文本
p.a {
text-align-last: right;
}
p.b {
text-align-last: center;
}
p.c {
text-align-last: justify;
}
自己动手试一试 »
文本方向
direction
和 unicode-bidi
属性可用于更改元素的文本方向
垂直对齐
vertical-align
属性设置元素的垂直对齐方式。
示例
设置图像在文本中的垂直对齐方式:
img.a {
vertical-align: baseline;
}
img.b {
vertical-align: text-top;
}
img.c {
vertical-align: text-bottom;
}
img.d {
vertical-align: sub;
}
img.e {
vertical-align: super;
}
自己动手试一试 »
CSS 文本对齐/方向属性
属性 | 描述 |
---|---|
direction | 指定文本方向/书写方向 |
text-align | 指定文本的水平对齐方式 |
text-align-last | 指定文本最后一行如何对齐 |
unicode-bidi | 与 direction 属性一起使用,以设置或返回文本是否应被覆盖以支持同一文档中的多种语言 |
vertical-align | 设置元素的垂直对齐方式 |