---
title: 常用字体属性
date: 2024-06-06T23:50:59Z
tags: []
---

## 大小

1. 如果没填字体大小会使用浏览器的字体默认大小
2. 最好给一个明确的值
3. 通常给body设置font-size属性,这样body里面的其他元素就可以继承了
4. 字体是等比例缩放,通常靠下

## 族

font-family:"字体1","字体2",字体族

> 字体族:serlf(衬线字体)或sans-serlf(非衬线字体)
> 微软默认字体是微软雅黑
> 英文的兼容性更好
> 字体名如果有空格必须用引号引起来
> 设置多个字体从左往右查找

## 字体风格

font-style= 字体风格;
normal:正常(默认)
italic:先使用字体自带的斜体效果,如果没有强制将正常的转成斜体
oblique:直接将正常的转成斜体

## 字体粗细

属性名:`font-weight`
关键词:

- lighter:细
- normal:正常
- bold:粗
- bolder:很粗(多数字体不支持)
数值:
100~1000无单位,理论数值越大字体越大(实际看字体设置的精度)

## 复合字体

属性名:font

1. 可以把上述样式都合并为一个字体
2. 字体族和字体必须写上
3. 字体族必须是最后一位,字体必须是倒数第二位
4. 各个属性用空格分开

## 文本的间距

字母间距:`letter-spacing`​  
字母间距`:word-spacing`​(通过空格识别)  
属性值为像素(px),正值让间距增大,负值让间隔变小

## 文本缩进

属性名:`text-indent`​  
属性值:css中的长度单位,例如`px`​

## 文本对齐(水平)

属性名:`text-align`​  
常用值:`left`​,`center`​,`right`​

## 文本对齐(垂直)

属性名:`vertical-align`  
属性值:`top`​,`center`​,`bottom`​

## 行高

属性值:`line-height`​  
可选值:  

1. `normal`​:由浏览器根据文字大小决定的一个默认值  
2. 像素(`px`​)  
3. 数值:参考自身font-size的倍数  
4. 百分比:参考自身font-size的百分比

### 注意事项

1. 过小不能产生重叠
2. 可以继承
3. ​`line-height`​:文字行高,背景高

## 默认样式

优先级:元素的默认样式>继承样式,如果要重置元素的默认样式,选择器一定要直接选择到该元素
