css补档 （壹）| 青训营笔记

这是我参与「第五届青训营 」伴学笔记创作活动的第4天

字体（font-family）

指定多个字体以防一个字体失效的时候使用下一个字体

<style>
  h1 {
    font-family: Optima, Georgia, serif;
  }
  body {
    font-family: Helvetica, sans-serif;
  }
</style>

补充：通用字体族（通用性强，一般用来备选）

Serif衬线体 Sans-Serif无衬线体``Cursive手写体 Fantasy``Monospace 等宽字体

使用Web Fonts

同理，中文也可以使用类似的方式从服务器中下载文字 $\color{blue}Added:$ 可以用工具进行裁切来保证只保留需要的文字

font-size

关键字

• small medium large 长度
• px,em 百分数
• 相对于父元素字体大小

font-style(斜体等等)

font-weight(100到900)

$\color{red}Plus:不是所有字体支持多种font-weight$

line-height

类似于front-size，但是存在特例（如图）

$\color{blue}Plus:这个1.6指的是行高是字体大小的1.6倍$

text-align(对齐)

• left左对齐
• center中对齐
• right右对齐
• justify(把空格拉长然后两边对齐，对最后一行不生效)

spacing（间隔）

• letter-spacing字符间距
• words-spacing单词间距

text-indent(段落首行缩进)

text-decoration

• none
• underline（下划线）
• line-through（删除线）
• overline（上划线）

white-space

• normal（多个空格合并，默认）
• nowrap（不换行）
• pre(保留所有)
• pre-warp（保留空格，保留换行）
• pre-line（合并空格，保留换行）

选择器特异度（优先级）

继承

某些属性会自动继承其父元素的计算值，除非显式制定一个值

和文字相关可以继承，和盒模型的不会继承

显式继承

所有的元素的box-sizing从父元素继承来（inherit）

初始值

在css中，每个属性抖音一个初始值

• background-color的初始值为transparent
• margin-left的初始值是0 可以使用initial关键字显式重置为初始值
• background-color:initial