文章目录
1.颜色
-
十六进制值：#ff0000
-
颜色名：black,silver,white…
上述两种是比较常用的。颜色对照表：CSS 颜色
下方是对颜色进行更加细致的定义：
-
RGB：rgb(255,0,0) 定义红、绿、蓝
-
RGBA：rgb(255,0,0,0.8) 定义红、绿、蓝，不透明度为80%
-
HSL：hsl(0,100%,50%) 定义色相、饱和度、明度
-
HSLA：hsl(0,100%,50%,0.8) 定义色相、饱和度、明度，不透明度为80%
2.字体
2.1.font-family：字体样式
- sans-serif：无衬线体，平滑时尚
- monospace：等宽字体
- 可以指定多个字体，越靠前的字体优先级越高
- 若字体由多个单词组成(中间有空格)，需要用引号括起
2.2.font-size：字体大小
值为对应的像素值
2.3.font-weitht：字重
可以理解为加粗的程度。值有如下：
| 可用值 | 值的说明 |
|---|---|
| normal | 默认值(400) |
| bold | 加粗(700) |
| lighter | 比父对象更淡一些 |
| bolder | 比父对象更粗一些 |
| 100-900 | 数值越大，字体越粗 |
说明一下lighter和bolder：
.parent {
font-weight: normal;
}
. child {
font-weight: bolder;
}
<div class="parent">
内容1：字重为"normal"
<div class="child">
内容2：字重为"bolder"，由于父级为"normal"，因此这里的字体采用"bold"
</div>
</div>
border和lighter都是相对于其父对象而言的。
2.4.font-style: 字体风格（是否倾斜）
| 常用值 | 描述 |
|---|---|
| normal | 默认 |
| oblique | 倾斜 |
值得一提的是，"italic"的作用也是使字体倾斜，但这里是使用字体自带的倾斜方式。若某些字体中没有倾斜的样式，使用"italic"便没有效果。
2.5.实践
3.其他样式设置
3.1.line-height：行高
特殊用法：当line-height（行高）和height（字体高度）相同时，字体便可以垂直居中
3.2.word-spacing：单词字间距
需要注意的是：这只对英文单词有效，对中文汉字是无效的！