CSS text-align 属性
CSS text-align 属性
CSS text-align 属性用于指定一个元素内部文本内容的水平对齐方式。该属性可用于块级元素和表格单元格。
属性值
text-align 属性可接受以下值:
- left:文本内容向左对齐。
- right:文本内容向右对齐。
- center:文本内容居中对齐。
- justify:文本内容两端对齐,同时以自然宽度增加间隔。
使用示例
水平居中对齐
.center {
text-align: center;
}
左对齐
.left {
text-align: left;
}
右对齐
.right {
text-align: right;
}
两端对齐
.justify {
text-align: justify;
}
注意事项
- text-align 属性并不改变元素中的块级内容,仅改变其在元素内的对齐方式。
- 若指定元素为行内元素,则 text-align 属性不起作用,需使用其父元素 align 属性或 display 属性设置为 block 才能生效。
- 若指定元素中包含表格,则 text-align 属性可应用于单元格(td 或 th):
- text-align 属性可设置在表格单元格上,以指定单元格中内容的水平对齐方式,但是不会影响表格中的其他单元格。
- 若要想让表格中所有单元格的文本内容水平居中,可设置表格的 text-align 属性为 center。
- text-align 属性只会影响其父元素中的文本内容,不会影响其子元素或后代元素,如需对其作用的所有后代元素生效,则需使用文本块容器。
应用场景
text-align 属性可用于以下情景:
- 文本块:适用于对段落、标题、列表等文本块进行水平对齐。
- 表格单元格:适用于对表格单元格中的文本内容进行水平对齐。
兼容性
text-align 属性可在所有主流浏览器中使用,包括 IE6 及以上版本。