CSS3文本效果
About 2 min
1. 文本阴影
在 CSS3 中，我们可以使用 text-shadow 属性将阴影应用于文本
语法：
text-shadow: h-shadow v-shadow blur color;
| 值 | 描述 |
|---|---|
| h-shadow | 必需。水平阴影的位置，允许负值 |
| v-shadow | 必需。垂直阴影的位置，允许负值 |
| blur | 可选。模糊的距离 |
| color | 可选。阴影的颜色 |
默认值：text-shadow: none; 表示没有阴影
2. 文本换行
在 CSS3 中，我们可以使用 white-space 属性设置文本换行方式
常用值如下：
| 值 | 含义 |
|---|---|
| normal | 文本超出边界自动换行，文本中的换行被浏览器识别为一个空格（默认值） |
| pre | 原样输出，与 pre 标签的效果相同 |
| pre-wrap | 在 pre 效果的基础上，超出元素边界自动换行 |
| pre-line | 在 pre 效果的基础上，超出元素边界自动换行，且识别文本中的换行，空格会忽略 |
| nowrap | 强制不换行 |
3. 文本溢出
在 CSS3 中，我们可以使用 text-overflow 属性设置文本内容溢出时的呈现模式
常用值如下：
| 值 | 含义 |
|---|---|
| clip | 当内联内容溢出时，将溢出部分裁切掉（默认值） |
| ellipsis | 当内联内容溢出块容器时，将溢出部分替换为 … |
注意：要使得 text-overflow 属性生效，块容器必须显式定义 overflow 为非 visible 值， white-space 为 nowrap 值
4. 文本修饰
CSS3 升级了 text-decoration 属性，让其变成了复合属性
text-decoration: text-decoration-line || text-decoration-style || text-decoration-color
子属性及其含义：
text-decoration-line设置文本装饰线的位置- none ： 指定文字无装饰 （默认值）
- underline ： 指定文字的装饰是下划线
- overline ： 指定文字的装饰是上划线
- line-through ： 指定文字的装饰是贯穿线
text-decoration-style文本装饰线条的形状- solid ： 实线 （默认）
- double ： 双线
- dotted ： 点状线条
- dashed ： 虚线
- wavy ： 波浪线
text-decoration-color文本装饰线条的颜色
5. 文本描边
注意：文字描边功能仅 webkit 内核浏览器支持
-webkit-text-stroke-width：设置文字描边的宽度，写长度值-webkit-text-stroke-color：设置文字描边的颜色，写颜色值-webkit-text-stroke：复合属性，设置文字描边宽度和颜色