CSS文本属性

1、 text-transform 可以用来设置文本的大小写

可选值：none 文本正常显示 默认值

capitalize 设置单词首字母大写

uppercase 设置单词大写

lowercase 设置单词小写

2、 text-decoration 可以用来设置文本的修饰

可选值：none 文本正常显示 默认值

underline 下划线

overline 上划线

line-through 删除线

3、 letter-spacing 可以指定字符间距

4、 word-spacing 可以设置单词之间的距离

5、 text-align 用于设置文本的对齐方式

可选值： left 文本左对齐

right 文本右对齐

center 文本居中对齐

justify 两端对齐

注意：设置之前需要确保有设置的空间

6、 text-indent 设置首行缩进

可以直接跟长度单位 px em rem

7、 white-space 设置网页如何处理空白

可选值：normal 换行

nowrap 不换行

8、 text-overflow 文本溢出包含元素时发生的事情

可选值：clip 修剪文本

ellipsis 显示省略号代替被修剪文本

string 显示给定字符串代替修剪文本

9、 text-shadow: h-shadow v-shadow blur color;

参数：

h-shadow 阴影的水平位移距离 正值向右 负值向左 必写

v-shadow 阴影的垂直位移距离 正值向下 负值向上 必写

blur 阴影的模糊半径 值越大阴影越模糊 可选值 默认是0px

color 阴影的颜色 一般用rgba形式 可选值 如果不写话，默认是字体的颜色

10、 box-shadow: h-shadow v-shadow blur color;

参数：

h-shadow 阴影的水平位移距离 正值向右 负值向左 必写

v-shadow 阴影的垂直位移距离 正值向下 负值向上 必写

blur 阴影的模糊半径 值越大阴影越模糊 可选值 默认是0px

color 阴影的颜色 一般用rgba形式 可选值 如果不写话，默认是黑色

11、 vertical-align 设置图文对齐的方式

可选值：baseline 默认值 基线对齐 以字母x最下方为参考标准

bottom 图文靠下对齐

middle 图文居中对齐

top 图文靠上对齐

12、 扩展延申

（1）引入图片后，图片与图片之间有一个大约三像素的空白，这就是图片三像素问题

解决图片三像素问题：

方案一：设置 vertical-align 只要非baseline，就可以解决

方案二：可以将图片转成块元素

方案三：将父元素的字体大小设置为0，也就是font-size：0px；,

如果父元素中有其他字体，需要重新设置

方案四：将元素脱离文档流，例如可以设置浮动，绝对定位，弹性盒子等

（2）设置文本单行省略

   p {  
        /* 设置固定宽度 */
        width: 200px;
        /* 设置文本不换行 */
        white-space: nowrap;
        /* 裁剪多余文本 */
        overflow: hidden;
        /* 多余文本以省略号的形式出现 */
        text-overflow: ellipsis;
     }