一、css字体
1、font-family
作用:设置文本的字体系列
语法:font-family:字体名称;
取值:一个字体名称 使用多个字体
微软雅黑 Microsoft YaHei
多个字体: 逗号隔开
如果浏览器不支持第一个字体,则会尝试下一个字体进行设置(回退机制)
注意:如果字体的名称包含空格、汉字、特殊符号。必须加引号;
2、font-size
作用:设置字体的大小
语法:font-size:值;
取值:
长度值(px)
百分比(相对于父元素)
em相对单位
如果用于字号,相对于父元素字号进行计算,如果用于其它属性,相对于当前元素的字号进行计算
浏览器字体大小的默认值是16px;
3、font-style
作用:设置字体的风格
语法:font-style:属性值;
取值:
normal 默认值 正常显示不倾斜
italic 斜体显示
4、font-weight
作用:设置字体的粗细
语法:font-weight:值;
取值;
normal 默认值· 正常粗细
bold 加粗
100-900九级字重,400 相当于normal;700相当于bold;
注意:并不是所有的字体都具备九级字重
5、line-height
作用:设置行高(效果是产生文本行间距)
语法:line-height:值;
测量方法: 文字高+行间距
特性:实现单行文本的垂直居中: 行高 =盒子高度
取值:
px
number设置数字; 数值与当前的字号相乘来设置行间距 number*font-size = 行高
百分比:相对于字体大小计算
简写:
语法: font:字体风格 字体粗细 字号/行高 字体系列;
注意:只有字号和字体系列同时存在时简写才会生效。
二、
css文本
1、text-align
作用:设置文本的水平对齐方式
语法:text-align:值;
取值:
center 居中对齐
left 居左对齐 默认值
right 居右对齐
justify 两端对齐
注意:适用于块级元素
2、text-decoration
作用:设置文本装饰线
语法:text-decoration:值;
取值:
line-through 删除线 穿过文本的一条线
underline 下划线 穿过文本下方的一条线
overline 上划线 穿过文本上方的一条线
none 去掉文本装饰线 【默认值】
3、text-indent
作用:设置哦文本的首行缩进
语法:text-indent:值;
取值: px、em
百分比:相对于元素的内容宽进行计算
允许负值出现
4、color
作用:设置字体颜色
语法:color:值;
取值:
关键字 : red 、 green
16进制色值: #ffffff == #fff
rgb颜色: r g b #ffffff
rgb(0,0,0) 0-255之间
rgba() a透明度 0-1之间 0全透明 1不透明
三、
选择器
类选择器 class
id选择器
标签选择器
通配符选择器
0 1 10 100
通配符选择器 < 标签选择器 < 类选择器 < id选择器
范围越精确,权重越高
四、外、内边距
外边距:
语法:margin:值;
margin-top: 100px;上外边距
margin-bottom: 50px;下外边距
margin-left: 50px;左外边距
margin-right: 50px 右外边距
padding :内边距 内容和边框之间的距离