目录
1:设置文本的大小写
text-transform
可以用来设置文本的大小写
可选值:
none 文本正常显示 默认值
uppercase 字母大写
lowercase 字母小写
capitalize 单词首字母大写
2:设置文本的修饰
text-decoration
可以用来设置文本的修饰
可选值:
none 文本正常显示 默认值
underline 文本下划线
overline 文本上划线
line-through 文本删除线
3:指定字符间距
letter-spacing
可以指定字符间距
4:设置单词之间的距离
word-spacing
可以设置单词之间的距离
5:设置文本的对齐方式
text-align
用于设置文本的对齐方式
可选值:
left 默认值,文本靠左对齐
right 文本靠右对齐
center 文本居中对齐
注意:设置文本的对齐方式,必须要给文本一定的空间,
如果行内元素的话,它的宽度是被内容撑开的,也就无法设置
6:设置首行缩进
text-indent
设置首行缩进
常用的长度单位:em
7:设置网页如何处理空白
white-space
设置网页如何处理空白,可以设置换不换行
8: 文本溢出包含元素时发生的事情
text-overflow
文本溢出包含元素时发生的事情
可选值:ellipsis 省略号
9: text-shadow(阴影效果)
h-shadow v-shadow blur color;
4个参数 (参数之间以空格隔开)
1、阴影的水平位移距离 正值向右,负值向左 必填
2、阴影的垂直位移距离 正值向下,负值向上 必填
3、阴影的模糊半径 选填,默认是0px
4、阴影的颜色 一般情况用rgba 选填,默认是字体的颜色
10:box-shadow(盒子阴影效果)
h-shadow v-shadow blur color;
4个参数跟text-shadow是一样
唯一不同的是
阴影的颜色 默认是黑色
11: 设置元素垂直对齐的方式
vertical-align
设置元素垂直对齐的方式
12:设置元素垂直对齐的方式
vertical-align
设置元素垂直对齐的方式
作用:
1、设置图文的对齐方式
2、解决图片三像素的问题
引入图片后,图片与图片之间会有三像素的空白,正常情况,这个空白我们是要去除
方法一:
vertical-align 非baseline
方法二:
设置其父元素的font-size为0
方法三:
设置图片为块元素
方法四:
使图片脱离文档流,设置它浮动或者绝对定位皆可
可选值:
baseline 基线对齐 默认值 以x的最下方为标准
top 文本靠上
bottom 文本靠下
middle 文本居中