常用的字体修饰属性
| 属性 | 描述 |
|---|---|
| font-size | 字体大小 单位:数字+px |
| font-weight | 字体粗细 单位:数字 |
| font-style | 字体倾斜 |
| line-height | 行高 单位:数字+px/数字(当前size的倍数) |
| font-family | 字体族 |
| font | 字体复合属性 |
| text-indent | 文本缩进 |
| text-align | 文本对齐 |
| text-decoration | 修饰线 |
| color | 颜色 |
事项
行高
行高实际由上间距+文本高度+下间距
测量方法:从一行文字的最顶端到下一行文字的最顶端。
单行文字想要垂直居中时,可以设置行高属性值与盒子高度属性值一致。
字体族
font-family属性值可以书写多个字体名用逗号隔开,依次从左到右查找。
复合属性
属性的简写方式,一个属性对应多个值的写法,各个属性值之间用空格隔开。(必须按顺序书写)
注:字号和字体必须书写,否则font不生效
文本缩进
属性名:text-indent
属性值:
- 数字+px
- 数字+em (1em表示当前标签的字号大小)
文本对齐方式
作用:控制内容水平对齐方式
属性名:text-align
| 属性值 | 效果 |
|---|---|
| left | 左对齐(默认) |
| center | 居中对齐 |
| right | 右对齐 |
想让图片居中,可以给图片加一个父级标签例如<div>设置居中
修饰线
属性名:text-decoration
| 属性值 | 效果 |
|---|---|
| none | 无 |
| underline | 下划线 |
| line-through | 删除线 |
| overline | 上划线 |
color文字颜色
写法:
| 颜色表示方法 | 属性值 | 说明 |
|---|---|---|
| 颜色关键字 | 颜色的英文单词 | |
| rgb表示法 | rgb(r,g,b) | r,g,b表示红绿蓝,取值0-255 |
| rgba表示法 | rgba(r,g,b,a) | a表示透明度,取值0-1 |
| 十六进制表示法 | #RRGGBB | 两两一组表示红绿蓝 |
如果一组当中两个数是一样的,可以简写为一位数:例如#00ffcc简写为#0fc










