text-align 用于定义元素内容的水平对齐方式。
可取属性值：
| 属性值 | 说明 |
|---|---|
left | 内容左对齐 |
center | 内容居中对齐 |
right | 内容右对齐 |
justify | 内容两端对齐，但对于强制打断的行（被打断的这一行）及最后一行（包括仅有一行文本的情况，因为它既是第一行也是最后一行）不做处理 |
start | 内容对齐开始边界 |
end | 内容对齐结束边界 |
match-parent | 这个值和 inherit 表现一致，只是该值继承的 start 或 end 关键字是针对父母的 direction 值并计算的，计算值可以是 left 和 right |
justify-all | 效果等同于 justify，不同的是最后一行也会两端对齐 |
text-align 的 justify 属性值p 都只有一行（所以既是第一行也是最后一行），所以无法通过定义 text-align: justify 来实现两端对齐，因为 text-align: justify 不会处理块级内容文本的最后一行text-align-last，可以通过定义 text-align-last: justify 来实现单行文本两端对齐text-align 或者 text-align-last 来实现单行文本两端对齐。那么可以换个思路，想办法让它们变成多行文本，使用伪元素派生一行新的占位内容是个不错的选择，此时再实现两端对齐，只需要 text-align 就行了vertical-align 用于定义行内元素在行框内的垂直对齐方式。
| 属性值 | 说明 |
|---|---|
baseline | 把当前盒的基线与父级盒的基线对齐。如果该盒没有基线，就将底部外边距的边界和父级的基线对齐 |
sub | 把当前盒的基线降低到合适的位置作为父级盒的下标（该值不影响该元素文本的字体大小） |
supr | 把当前盒的基线提升到合适的位置作为父级盒的上标（该值不影响该元素文本的字体大小） |
text-top | 把当前盒的 top 和父级的内容区的 top 对齐 |
text-bottom | 把当前盒的 bottom 和父级的内容区的 bottom 对齐 |
middle | 把当前盒的垂直中心和父级盒的基线加上父级的半 x-height 对齐 |
top | 把当前盒的 top 与行盒的 top 对齐 |
bottom | 把当前盒的 bottom 与行盒的 bottom 对齐 |
<percentage> | 把当前盒提升（正值）或者降低（负值）这个距离，百分比相对 line-height 计算。当值为 0%时等同于 baseline |
<length> | 把当前盒提升（正值）或者降低（负值）这个距离。当值为 0 时等同于 baseline |
text-decoration 为简写属性，用于定义元素文本装饰。
语法：
text-decoration: <text-decoration-line> | <text-decoration-style> | <text-decoration-color>
对于 <text-decoration-line> 的可取属性值：
| 属性值 | 说明 |
|---|---|
none | 文字无装饰 |
underline | 文字的装饰是下划线 |
overline | 文字的装饰是上划线 |
line-through | 文字的装饰是贯穿线 |
blink | 文字的装饰是闪烁 |
对于 <text-decoration-style> 可取的属性值：
| 属性值 | 说明 |
|---|---|
solid | 实线 |
double | 双线 |
dotted | 点状线条 |
dashed | 虚线 |
wavy | 波浪线 |
CSS 文字装饰 text-decoration & text-emphasis
text-transform 用于定义元素的文本如何转换大小写。
| 属性值 | 说明 |
|---|---|
none | 无转换 |
capitalize | 将每个单词的第一个字母转换成大写 |
uppercase | 将每个单词转换成大写 |
lowercase | 将每个单词转换成小写 |
full-width | 将所有字符转换成 fullwidth 形式。如果字符没有相应的 fullwidth 形式，将保留原样。这个值通常用于排版拉丁字符和数字等表意符号 |
text-justify 用于定义使用什么方式实现文本内容两端对齐。
| 属性值 | 说明 |
|---|---|
auto | 允许浏览器用户代理确定使用的两端对齐法则 |
none | 禁止两端对齐 |
inter-word | 通过增加字之间的空格对齐文本。该行为是对齐所有文本行最快的方法，它的两端对齐行为对段落的最后一行无效 |
inter-ideograph | 为表意字文本提供完全两端对齐，增加或减少表意字和词间的空格 |
inter-cluster | 调整文本无词间空格的行。这种模式的调整是用于优化亚洲语言文档的 |
distribute | 通过增加或减少字或字母之间的空格对齐文本，适用于东亚文档，尤其是泰国 |
kashida | 通过拉长选定点的字符调整文本。这种调整模式是特别为阿拉伯脚本语言提供的 |
注意事项：
text-align 属性必须设置为 justifytext-indent 用于定义块内文本内容的缩进。
| 属性值 | 说明 |
|---|---|
<length> | 用长度值指定文本的缩进。可以为负值 |
<percentage> | 用百分比指定文本的缩进。可以为负值 |
each-line | 定义缩进作用在块容器的第一行或者内部的每个强制换行的首行，软换行不受影响 |
hanging | 反向所有被缩进作用的行 |
注意事项：
hanging 和 each-line 关键词紧随在缩进数值之后示例：
div {text-indent: 2em each-line;}
text-overflow 用于当块容器 overflow 为非 visible 时，定义内联内容溢出其块容器是否截断或者添加 ... 及自定义字符。
| 属性值 | 说明 |
|---|---|
clip | 当内联内容溢出块容器时，将溢出部分裁切掉 |
ellipsis | 当内联内容溢出块容器时，将溢出部分替换为 ... |
注意事项：
text-overflow 属性生效，块容器必须显式定义 overflow 为非 visible 值，同时显式或者隐式地定义 width 为非 auto 值，white-space 为 nowrap 值letter-spacing 用于指定字符之间的额外间隙。
可取属性值：
| 属性值 | 说明 |
|---|---|
none | 默认间隔，计算值为 0 |
<length> | 用长度值指定字符间隔。可以为负值 |
注意事项：
word-spacing 用于指定单词之间的额外间隙。
| 属性值 | 说明 |
|---|---|
none | 默认间隔，计算值为 0 |
<length> | 用长度值指定字符间隔。可以为负值 |
<percentage> | 用百分比指定字符间隔。可以为负值 |
注意事项：
word-wrap 用于设置或检索当内容超过指定容器的边界时是否断行。
| 属性值 | 说明 |
|---|---|
normal | 允许内容顶开或溢出指定的容器边界 |
break-word | 内容将在边界内换行，如果需要，单词内部允许断行。 它要求一个没有断行破发点的词必须保持为一个整体单位，如果当前行无法放下需要被打断的单词，为了保持完整性，会将整个单词放到下一行进行展示 |
word-break 用于定义元素内容文本的字间与字符间的换行行为。
| 属性值 | 说明 |
|---|---|
normal | 默认的换行规则。依据各自语言的规则，允许在字间发生换行 |
keep-all | 对于 CJK（中文，韩文，日文）文本不允许在字符内发生换行，Non-CJK 文本表现同 normal |
break-all | 对于 Non-CJK 文本允许在任意字符内发生换行。该值适合包含一些非亚洲文本的亚洲文本，比如使连续的英文字符断行 |
break-word | 与 break-all 相同，不同的地方在于它要求一个没有断行破发点的词必须保持为一个整体单位。这与 word-wrap 的 break-word 值效果相同 |
white-space 用于指定元素是否保留文本间的空格、换行；指定文本超过边界时是否换行。
| 属性值 | 说明 |
|---|---|
normal | 默认处理方式。会将序列的空格合并为一个，内部是否换行由换行规则决定 |
pre | 原封不动的保留你输入时的状态，空格、换行都会保留，并且当文字超出边界时不换行。等同 <pre> 元素效果 |
nowrap | 与 normal 值一致，不同的是会强制所有文本在同一行内显示 |
pre-wrap | 与 pre 值一致，不同的是文字超出边界时将自动换行 |
pre-line | 与 normal 值一致，但是会保留文本输入时的换行 |
相关属性：line-height
line-box 决定line-hight 会撑起 inline-box 的高度，并不会影响本身布局的高度，但是会影响外部元素（line-box）inline-box 组成 line-box，line-box 高度是由 inline-box 决定line-height 做就行了base-line 对齐，如果要居中对齐就用 vertical-align: middle原理：按照 inline 排版，如果按照 inline 排版的话，默认按照基线排版（base-line）
基线和底线之间有距离的，如果 12px 字体那么缝隙可能就是 3px 解决方案：按照底线对齐，vertical-align: bottom 或者 display:block