首页 > 代码库 > CSS文本属性
CSS文本属性
CSS文本：
属性 | 描述 |
color | 设置文本颜色 |
direction | 设置文本方向。 |
line-height | 设置行高。 |
letter-spacing | 设置字符间距。 |
text-align | 对齐元素中的文本。 |
text-decoration | 向文本添加修饰。 |
text-indent | 缩进元素中文本的首行。 |
text-shadow | 设置文本阴影。 |
text-transform | 控制元素中的字母。 |
unicode-bidi | 设置文本方向。 |
white-space | 设置元素中空白的处理方式。 |
word-spacing | 设置字间距。 |
1.缩进文本：text-indent属性；
（1）用法：text-indent 属性规定文本块中（块级元素）首行文本的缩进。允许使用负值。如果使用负值，那么首行会被缩进到左边（悬挂缩进）。
（2）可能的值：
值 | 描述 |
length | 定义固定的缩进。默认值：0。 |
% | 定义基于父元素宽度的百分比的缩进。 |
inherit | 规定应该从父元素继承 text-indent 属性的值。 |
Ps: text-indent 属性可以继承
2.水平对齐：text-align属性
（1）用法：text-align 属性规定元素中的文本的水平对齐方式。
（2）可能的值：
值 | 描述 |
left | 把文本排列到左边。默认值：由浏览器决定。 |
right | 把文本排列到右边。 |
center | 把文本排列到中间。 |
justify | 实现两端对齐文本效果。 |
inherit | 规定应该从父元素继承 text-align 属性的值。 |
ps：将块级元素或表元素居中，要通过在这些元素上适当地设置左、右外边距来实现。
3.字间隔：word-spacing 属性
（1）用法：word-spacing 属性增加或减少单词间的空白（即字间隔）；
（2）关于“字”的定义：
CSS 把“字（word）”定义为任何非空白符字符组成的串，并由某种空白字符包围。这个定义没有实际的语义，它只是假设一个文档包含由一个或多个空白字符包围的字。
（3）可能的值：（允许使用负值）
值 | 描述 |
normal | 默认。定义单词间的标准空间。 |
length | 定义单词间的固定空间。 |
inherit | 规定应该从父元素继承 word-spacing 属性的值。 |
Ps: 如果指定为长度值，会调整字之间的通常间隔；所以，normal 就等同于设置为 0。允许指定负长度值，这会让字之间挤得更紧。
4.字母间隔：letter-spacing 属性
（1）用法：字母间隔修改的是字符或字母之间的间隔；
（2）可能的值：（允许使用负值）
值 | 描述 |
normal | 默认。规定字符间没有额外的空间。 |
length | 定义字符间的固定空间（允许使用负值）。 |
inherit | 规定应该从父元素继承 letter-spacing 属性的值。 |
5. 字符转换：text-transform属性
（1）用法：处理文本的大小写；
（2）可能的值：
值 | 描述 |
none | 默认。定义带有小写字母和大写字母的标准的文本。 |
capitalize | 文本中的每个单词以大写字母开头。 |
uppercase | 定义仅有大写字母。 |
lowercase | 定义无大写字母，仅有小写字母。 |
inherit | 规定应该从父元素继承 text-transform 属性的值。 |
6.文本装饰：text-decoration属性
（1）用法：text-decoration 属性规定添加到文本的修饰；
（2）可能的值：
值 | 描述 |
none | 默认。定义标准的文本。 |
underline | 定义文本下的一条线。 |
overline | 定义文本上的一条线。 |
line-through | 定义穿过文本下的一条线。 |
blink | 定义闪烁的文本。 |
inherit | 规定应该从父元素继承 text-decoration 属性的值。 |
Ps: IE、Chrome 或 Safari 不支持 "blink" 属性值。且text-decoration 值会替换而不是累积起来。
7.处理空白符：white-space属性：
（1）用法：white-space 属性设置如何处理元素内的空白。
（2）可能的值：
值 | 描述 |
normal | 默认。空白会被浏览器忽略。 |
pre | 空白会被浏览器保留。其行为方式类似 HTML 中的 <pre> 标签。 |
nowrap | 文本不会换行，直到遇到 <br> 标签为止。 |
pre-wrap | 保留空白符序列，但是正常地进行换行。 |
pre-line | 合并空白符序列，但是保留换行符。 |
inherit | 规定应该从父元素继承 white-space 属性的值。 |
（3）小结：
值 | 空白符 | 换行符 | 自动换行 |
pre-line | 合并 | 保留 | 允许 |
normal | 合并 | 忽略 | 允许 |
nowrap | 合并 | 忽略 | 不允许 |
pre | 保留 | 保留 | 不允许 |
pre-wrap | 保留 | 保留 | 允许 |
8.文本方向：direction属性：
（1）用法：direction 属性规定文本的方向 / 书写方向，影响块级元素中文本的书写方向、表中列布局的方向、内容水平填充其元素框的方向、以及两端对齐元素中最后一行的位置。
（2）可能的值：
值 | 描述 |
ltr | 默认。文本方向从左到右。 |
rtl | 文本方向从右到左。 |
inherit | 规定应该从父元素继承 direction 属性的值。 |
Ps: 对于行内元素，只有当 unicode-bidi 属性设置为 embed 或 bidi-override 时才会应用 direction 属性。
CSS文本属性