9、css文本属性和css文字属性

css文本属性

1.文本颜色

格式：color:"值"；

取值：单词.....

2.文本的水平对齐方式

格式：text-align:值

取值：left center right

3.文本的垂直对齐方式

格式：vertical-align:值；

取值：top middle bottom

注意：文图共存时，文字在图片的位置居中 在图片中设置

4.文本的缩进

格式：text-indent:值

取值：XX px[像素] em汉字如【1em】

5.文本的行高

格式：line-height:值；

取值：xx px;[像素]

6.文本的装饰

格式：text-decoration:值；

取值：underline 下划线 none默认的 没有线 overline 上划线 line-through 删除线

注意：去掉a标签的下划线可以使用text-decoration:none；

7.颜色的取值：

color:red

1.单词的取值

一般只用于常见的颜色，有局限性

color:rgb(255,0,0) r[red] g[green] b[blue]

2.其中每一个数字的取值范围在0-255之间 0表示无色 255表示纯色

注意：不要求自己配颜色，但是必须会个灰色

三个值相同即为灰色，值越大越白 值越小越黑

如 rgb(100,100,100)

color:rgba(255,0,0,1)

3.和rgb相同 唯一多了a a代表透明度 取值0-1之间 值越小越透明

半透明color:rgba(255,0,0,0.5)

color:#FF0000

4.十六进制取值

跟rgb相同 前两位代表red 中间两位代表green 后边两位代表blue

只不过一个是十进制的值 一个是十六进制的值

想要验证#FF0000就是红色 就要学会16进制转10进制

公式：十六进制第一位*16+十六进制第二位=十进制

十六进制 0 1 2 3 4 5 6 7 8 9 a b c d e f

十进制 0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

FF

15*16+15=255

00

0*16+0=0

00

0*16+0=0

color:#FF0000

5在css中十六进制的颜色每两位相同可以简写为1位

注意：当颜色对应的数字不一样时不能简写 #abcdef

相同的数字不属于同一个颜色 不能简写 #ABBCDE

css文字属性

1.文字的属性

字体的类型

格式：font-family:"值";

取值：黑体，微软雅黑，宋体，楷体.......

注意：你所设置的字体必须是电脑中存在的字体。

字体的大小

格式：font-size:"值"

取值：XX px[像素]

注意：通过font-size设置文字大小 一定要加单位

字体的粗细

格式：font-weight:值;

取值：bold加粗 bolder更粗 lighter正常粗细 100-900整数取值 值越大越粗

字体的风格

格式：font-style:值；

取值：italic倾斜 normal正常

2.字体属性的扩充

1.当我们设置了一个字体，电脑中不存在，但是又不想用电脑中默认的字体怎么办？

解决方式：添加备选方案

格式：font-family:"值","备选方案";

2.简写

格式：font: 风格 粗细 大小 类型；

注意：中间空格隔开