CSS常用属性（文本属性）

一、文本颜色

属性名： color 作用：控制文字的颜色。 可选值：

1. 颜色名
2. rgb 或 rgba
3. HEX 或 HEXA （十六进制）
4. HSL 或 HSLA

开发中常用的是： rgb/rgba 或 HEX/HEXA （十六进制）。

举例：

div {
    color: rgb(112,45,78);
}

二、文本间距

字母间距： letter - spacing 单词间距： word - spacing （通过空格识别词） 属性值为像素（ px ），正值让间距增大，负值让间距缩小。

三、文本修饰

属性名： text - decoration 作用：控制文本的各种装饰线 可选值：

1. none ： 无装饰线（常用）
2. underline ：下划线（常用）
3. verline ： 上划线
4. line - through ： 删除线

可搭配如下值使用：

1. dotted ：虚线
2. wavy ：波浪线
3.  也可以指定颜色

举例：

a {
    text-decoration: none;
}

四、文本缩进

属性名： text - indent 。 作用：控制文本首字母的缩进。 属性值： css 中的长度单位，例如： px 举例：

div {
    text-indent:40px;
}

五、文本对齐_水平

属性名： text - align 。 作用：控制文本的水平对齐方式。 常用值：

1. left ：左对齐（默认值）
2. right ：右对齐
3. center ：居中对齐

举例：

div {
    text-align: center;
}

六、font-size

1. 由于字体设计原因，文字最终呈现的大小，并不一定与 font - size 的值一致，可能大，也可能小。（ 例如： font - size 设为 40px ，最终呈现的文字，可能比 40px 大，也可能比 40px 小。）

2. 通常情况下，文字相对字体设计框，并不是垂直居中的，通常都靠下 一些。

七、行高

属性名： line - height 作用：控制一行文字的高度。 可选值：

1. normal ：由浏览器根据文字大小决定的一个默认值。
2. 像素 ( px ) 。
3. 数字：参考自身 font - size 的倍数（很常用）。
4. 百分比：参考自身 font - size 的百分比。

（由于字体设计原因，文字在一行中，并不是绝对垂直居中，若一行中都是文字，不会太影响观感。）

举例：

div {
    line-height: 60px;
    line-height: 1.5;
    line-height: 150%;
}

行高注意事项：

1.  line-height 过小会怎样？—— 文字产生重叠，且最小值是 0 ，不能为负数。
2.  line-height 是可以继承的，且为了能更好的呈现文字，最好写数值。
3.  line-height 和 height 是什么关系？
   • 设置了 height ，那么高度就是 height 的值。
   • 不设置 height 的时候，会根据 line - height 计算高度。

 应用场景：

1.  对于多行文字：控制行与行之间的距离。
2.  对于单行文字：让 height 等于 line-height ，可以实现文字垂直居中。

（由于字体设计原因，靠上述办法实现的居中，并不是绝对的垂直居中，但如果一行中都是文字，不会太影响观感。）

八、文本对齐_垂直  

顶部： 无需任何属性，在垂直方向上，默认就是顶部对齐。 居中： 对于单行文字，让 height = line - height 即可。（ 多行文字垂直居中可以用定位去做 ） 底部： 对于单行文字，目前一个临时的方式：         让 line - height = ( height × 2 ) - font - size - x 。（ x 是根据字体族，动态决定的一个值。）         （垂直方向上的底部对齐，同样用定位去做）

九、vertical-align

属性名： vertical - align 。 作用：用于指定 同一行元素之间 ，或 表格单元格 内文字的 垂直对齐方式 。 常用值：

1.  baseline （默认值）：使元素的基线与父元素的基线对齐。
2.  top ：使元素的顶部与其所在行的顶部对齐。
3.  middle ：使元素的中部与父元素的基线加上父元素字母 x 的一半对齐。
4.  bottom ：使元素的底部与其所在行的底部对齐。

（vertical-align 不能控制块元素。）