设置文本对齐方式- text-align,text-align-last
取值说明
- left:文本居左。
- center:文本居中。
- right:文本居右。
- justify:两端对齐。
- start:对齐开始边界。
- end:对齐结束边界。
- match-parent:不支持。
- justify-all:不支持。
注意事项
- 该属性只是适用于块级元素。
- start和end属性是和文本的起始方向有关的,正常情况下,start和left表现一直,end和right表现一直,当文本方向和正常不一致时,两者表现才出现差异,参看示例一。
- 大部分浏览器要使得 text-align 的justify两端对齐生效,需要在汉字间插入有空白,如空格;
- 容器内最后一行文本(包括行内只有一行文本的情况,这时既是第一行,也是最后一行文本),单纯的使用justify无法实现两端对齐,需要配合text-align-last属性。
单行文本的两端对齐
由于所有主流浏览器都支持text-align的justify,但是大部分的浏览器不支持text-align-last属性,所以针对不同的浏览器需要采取不同的措施。
1.当支持text-align-last的时候,使用text-align-last将文本对齐,参看示例二。
2.当浏览器不支持text-align-last时,可以使用可以对非IE及IE7以上浏览器使用伪对象生成额外的内容(IE7及以下的使用)text-align-last,置于第二行并将其隐藏,这时第一行文本(即要对齐的那个单行文本)可使用text-align:justify来对齐。参看示例三。
示例一
正常情况下的start
正常情况下的left
特殊文本方向情况下的start
特殊文本方向情况下的left
示例二
示例三
应用场景:form表单的label文本两端对齐