---
# System prepended metadata

title: 字體與行距
tags: [HTML&CSS]

---

###### tags: `HTML&CSS`
# 字體與行距
## font-family

- 可以設定多種字體，瀏覽器會依照順序加載字體到網頁中
- 中文字體幾乎都有英文名稱，兼容性比較高
- 為了防止所有字體都不能使用，會在最後加上generic-family通用字體。
1. sans-serif(無襯線體)
2. serif(有襯線體)
3. monospace(等寬體)
4. cursive(手寫體)
5. fantasy(幻想體)

```css=
font-family: "Arial", "Verdana", "sans-serif";
```
## line-height
- 文字本身沒有高度
- 文字的高度是由行距產生高度
- 在line height為0px時多行文字會重疊在一起且高度為0

![](https://i.imgur.com/yMZ1E9V.png)








