CSS 文本属性篇
文字颜色
- 属性名:
color
- 作用:控制文字的颜色
- 可选值:
1.颜色名
color: blue;
2.rgb或rgba
color:rgb(132, 220, 254);
color:rgba(132, 220, 254,0.5);
3.hex或hexa(十六进制)
color:#0078d4;
color:#0078d48b;
4.hsl或hsla
rgb和rgba的区别,即加了个透明度的值,3和4同理
文本间距
- 字母间距:
letter-spacing
letter-spacing: 20px;
- 单词间距:
word-spacing
word-spacing: 20px;
单词间距,以什么来判断是否是单词呢,中文又如何判断呢,实际上是以空格判断是否是一个单词
文本修饰
- 属性名:
text-decoration
- 作用:控制文本的各种装饰线
- 可选值:
none
: 无装饰线(常用)
text-decoration: none;
underline
:下划线(常用)
text-decoration: underline;
overline
:上划线
text-decoration: overline;
line-through
:删除线
text-decoration: line-through;
- 可附加值:
dotted
:虚线
text-decoration: underline dotted;
wavy
:波浪线
text-decoration: underline wavy ;
- 颜色(可使用多种颜色格式)
text-decoration: underline wavy rgb(132, 220, 254);
文本缩进
- 属性名:
text-indent
text-indent: 40px;
- 作用:控制文本首字母的缩进
- 属性值: css中的长度单位
文本对齐-水平
- 属性名:
text-align
- 作用:控制文本的水平对齐方式
- 常用值:
1.left
:左对齐(默认)
text-align: left;
2.right
:右对齐
text-align: right;
3.center
:居中对齐
text-align: center;
行高
- 属性名:
line-height
- 作用:控制一行文字的高度
- 可选值:
1.``:使用浏览器默认行高
2.使用像素描述高度
line-height: 100px;
3.参考自身的字体大小的倍数
line-height: 15;
4.同3但转化为百分数
line-height: 1500%;
文本对齐_垂直
- 属性名:
vertical-align
- 作用:用于指定同一行元素之间或表格单元格的垂直对齐方式
- 常用值:
1.baseline
(默认值) :使元素的基线与父元素的基线对齐
2.top
:使元素的顶部与其所在行的顶部对齐
3.middle
:使元素的中部与父元素的基线加上父元素字母 x 的一半对齐,即居中对齐
4.bottom
:使元素的底部与其所在行的底部对齐。
温馨提醒:该属性不能控制块级元素