字体样式处理
font-size:30px;// 设置字体大小
font-weight:700;//设置粗体
font-sytle:italic; //设置文字斜体
font-family: 斜体,宋体,隶书,sans-serif;//从左到右,依次匹配,匹配即停止sans-serif为电脑默认字体
连写顺序要求:style weight size family ;简答记忆swsf(稍微舒服)
font:italic 700 30px 斜体,宋体,隶书,sans-serif;
注意:省略要求,只能省略前两个,后面两个是不要省略(如果省略了取值,相当于设置了默认值),如果省略了一个,要将其写在连写语句的下面,否则将被默认值覆盖
文本处理
1.文本缩进
text-indent:2em;1em也就是1个font-size的大小
也就是一个段落首行空格两个字符大小
2.文本水平对齐方式
text-align 是跟文本所在的标签设置,也就是文字的父元素
| 属性值 |
效果 |
| left |
左对齐 |
| right |
右对齐 |
| center |
居中对齐 |
3.文本修饰
text-decoration 属性
| 属性值 |
效果 |
| underline |
下划线(常用) |
| line-through |
删除线(不常用) |
| overline |
上划线(几乎不用) |
| none |
无装饰线(常用a标签去除) |
text-align:center;的使用总结让以下元素水平居中
1.文本
2.span标签、a标签
3.input标签、img标签
注意:一定是给本身本身标签的父元素做设置,才可以水平居中(可自己设置一个盒子)
如果对盒子div、p、h做水平居中处理:
可以使用margin:0 auto;
注意:1.对盒子div、p、h做水平居中处理,直接 对盒子元素本身 设置即可
2.margin:0 auto 一般针对固定宽度的盒子,如果盒子没有设置宽度,默认占满父元素的宽度
对单行文本垂直居中
line-height:当前父元素的的高度;
font 结合 line-height连写设置,语法不对则会覆盖无效
font:style weight size/line-height family
注意:如果是多行文本,则不能使用;
在精准web布局当中需要取消行高的默认设置,则用line-height:1;自己设置行高的高度