font 属性
| 分类 | 属性 | 说明 | 示例 |
|---|---|---|---|
| 🎨 字体族 | font-family | 指定字体名称或字体族 | "Inter", "Microsoft YaHei", sans-serif; |
| 🎚 字号 | font-size | 控制字体大小 | 16px / 1rem |
| 💪 粗细 | font-weight | 控制字体粗细 | 400 / 700 / bold |
| 🔠 样式 | font-style | 斜体或正常字体 | italic / normal |
| 📏 行高 | line-height | 控制行间距 | 1.5 / 24px |
| 🧍♂️ 字间距 | letter-spacing | 控制字符之间的距离 | 0.05em |
| 🧍♀️ 单词间距 | word-spacing | 控制单词之间的间距（英文用） | 0.1em |
| 🔠 大小写 | text-transform | 全大写、小写或首字母大写 | uppercase |
| 📏 对齐 | text-align | 文本水平对齐方式 | left / center / right |
| ✍️ 装饰 | text-decoration | 下划线、删除线等 | underline / none |
| 🌈 颜色 | color | 字体颜色 | #333 / rgb(0,0,0) |
| ☁️ 阴影 | text-shadow | 添加文字阴影 | 2px 2px 4px rgba(0,0,0,.3) |
| 🧭 空白处理 | white-space | 控制是否换行 | nowrap / pre-wrap |
| 🧾 断行规则 | word-break | 控制换行点（中英混排时常用） | break-all / keep-all |
| 🧱 连续空格 | white-space | 保留空格或换行方式 | pre / pre-line |
| ⚙️ 复合属性 | font | 一行写完字号、粗细、行高、字体族 | bold 16px/1.5 "Inter", sans-serif |
进阶属性
| 属性 | 说明 | 示例 |
|---|---|---|
| font-stretch | 可变字体拉伸宽度（现代浏览器） | 120% |
| font-variant | 小型大写字母样式 | small-caps |
| font-feature-settings | 控制字体特性（如连字） | "liga" off |
| font-variation-settings | 控制 Variable Font 的轴 | "wght" 700 |
| text-overflow | 超出显示省略号 | ellipsis |
| overflow-wrap | 长单词自动断行 | break-word |
| writing-mode | 竖排文本（中文竖排常用） | vertical-rl |
| text-orientation | 控制竖排文字方向 | upright |