数字数据类型
每条 CSS 声明都由一个属性/值对组成。根据属性的不同，值可以包含各种数据类型，例如单个数字、关键字、函数，或不同类型的组合；有些值有单位，而有些则没有。数字数据类型包括 <integer>、<number>、<dimension> 和 <percentage> 值。本指南是对数字数据类型的概述。有关每种值类型的更详细信息，请参阅各自的页面。
整数
整数是一个或多个十进制数字，0 到 9，例如 1024 或 -55。整数前面可以有 + 或 - 符号，符号和整数之间没有空格。
数字
<number> 代表一个实数，可能有也可能没有带小数部分的小数点，例如 0.255、128 或 -1.2。数字前面也可以有 + 或 - 符号。
维度
<dimension> 是一个带单位的 <number>，例如 45deg、100ms 或 10px。附加的单位标识符不区分大小写。数字和单位标识符之间绝不能有空格或任何其他字符：即 1 cm 是无效的。
CSS 使用维度来指定
这些都将在下面的小节中介绍。
距离单位
当一个属性的值允许使用距离单位（也称为长度）时，这被描述为 <length> 类型。CSS 中有两种类型的长度：相对长度和绝对长度。相对长度单位指定一个与其他事物相关的长度。
相对长度有两种类型：字体相对长度和视口百分比长度。这两种类型又各自分为两种。字体相对长度单位可以是局部字体相对的，也可以是根字体相对的。视口百分比长度可以是相对于视口高度或宽度的，或者如 CSS 包含模块中所定义的，相对于容器的。
局部字体相对长度
局部字体相对长度是相对于“局部”字体大小或行高的，它指定一个与元素本身某个特征的计算尺寸相关的长度，或者在出现循环引用的情况下，相对于元素的继承值，例如 font-size 属性的 em 值或 line-height 属性的 lh 值。例如，em 相对于元素的字体大小，而 ex 相对于元素字体的 x-height。
| 单位 | 相对于 |
|---|---|
cap |
元素字体的 Cap height（大写字母的标称高度）。 |
ch |
元素字体中窄字形的平均字符宽度，以“0”（ZERO, U+0030）字形为代表。 |
em |
元素字体的字体大小。 |
ex |
元素字体的 x-height。 |
ic |
元素字体中全角字形的平均字符宽度，以“水”（CJK 水表意文字，U+6C34）字形为代表。 |
lh |
元素的行高。 |
根字体相对长度
根字体相对长度指定一个与元素的根元素祖先相关的长度，例如 <HTML> 或 <SVG>。例如，rem 相对于根元素的字体大小，而 rex 是根元素字体的 x-height。
| 单位 | 相对于 |
|---|---|
rcap |
根元素字体的 Cap height（大写字母的标称高度）。 |
rch |
根元素字体中窄字形的平均字符宽度，以“0”（ZERO, U+0030）字形为代表。 |
rem |
根元素字体的字体大小。 |
rex |
根元素字体的 x-height。 |
ric |
根元素字体中全角字形的平均字符宽度，以“水”（CJK 水表意文字，U+6C34）字形为代表。 |
rlh |
根元素的行高。 |
视口单位
视口单位长度指定一个相对于视口尺寸的长度。例如，vw 相对于视口的宽度，vh 相对于视口的高度。
| 单位 | 相对于 |
|---|---|
dvh |
动态视口高度的 1%。 |
dvw |
动态视口宽度的 1%。 |
lvh |
大视口高度的 1%。 |
lvw |
大视口宽度的 1%。 |
svh |
小视口高度的 1%。 |
svw |
小视口宽度的 1%。 |
vb |
根元素块轴方向上视口尺寸的 1%。 |
vh |
视口高度的 1%。 |
vi |
根元素行内轴方向上视口尺寸的 1%。 |
vmax |
视口较大尺寸的 1%。 |
vmin |
视口较小尺寸的 1%。 |
vw |
视口宽度的 1%。 |
容器单位
容器查询长度单位指定一个相对于查询容器尺寸的长度。例如，cqw 相对于查询容器的宽度，cqh 相对于查询容器的高度。
| 单位 | 相对于 |
|---|---|
cqb |
查询容器块级尺寸的 1% |
cqh |
查询容器高度的 1% |
cqi |
查询容器行内尺寸的 1% |
cqmax |
cqi 或 cqb 中的较大值 |
cqmin |
cqi 或 cqb 中的较小值 |
cqw |
查询容器宽度的 1% |
绝对长度单位
绝对长度单位固定于一个物理长度：英寸或厘米。因此，当输出是固定尺寸的媒体（如打印）时，许多这些单位更为有用。例如，mm 是物理毫米，即厘米的 1/10。
| 单位 | 名称 | 等同于 |
|---|---|---|
cm |
厘米 | 1cm = 96px/2.54 |
in |
英寸 | 1in = 2.54cm = 96px |
mm |
毫米 | 1mm = 1/10 cm |
pc |
Pica（派卡） | 1pc = 1/6 in |
pt |
Point（点） | 1pt = 1/72 in |
px |
像素 | 1px = 1/96 in |
Q |
四分之一毫米 | 1Q = 1/40 cm |
当包含长度值时，如果长度为 0，则不需要单位标识符。否则，单位标识符是必需的，不区分大小写，并且必须紧跟在值的数字部分之后，中间没有空格。
角度单位
角度值由 <angle> 类型表示，并接受以下值
| 单位 | 名称 | 描述 |
|---|---|---|
deg |
度 | 一个完整的圆有 360 度。 |
grad |
百分度 | 一个完整的圆有 400 百分度。 |
rad |
弧度 | 一个完整的圆有 2π 弧度。 |
turn |
圈 | 一个完整的圆有 1 圈。 |
时间单位
时间值由 <time> 类型表示。当包含时间值时，单位标识符——s 或 ms——是必需的。它接受以下值。
| 单位 | 名称 | 描述 |
|---|---|---|
ms |
毫秒 | 一秒有 1,000 毫秒。 |
s |
秒 |
频率单位
频率值由 <frequency> 类型表示。它接受以下值。
| 单位 | 名称 | 描述 |
|---|---|---|
Hz |
赫兹 | 表示每秒出现的次数。 |
kHz |
千赫兹 | 一千赫兹是 1000 赫兹。 |
1Hz，也可以写成 1hz 或 1HZ，是每秒一个周期。
弹性单位
弹性单位由 <flex> 类型表示。它接受以下值。
| 单位 | 名称 | 描述 |
|---|---|---|
fr |
Flex | 表示网格容器内的弹性长度 |
分辨率单位
分辨率单位由 <resolution> 类型表示。它们通过指示在 CSS 英寸、厘米或像素中可以容纳多少个点来表示图形表示中单个点的大小，例如屏幕。它接受以下值
| 单位 | 描述 |
|---|---|
dpcm |
每厘米点数。 |
dpi |
每英寸点数。 |
dppx、x |
每 px 单位点数。 |
百分比
<percentage> 是一种表示某个其他值的分数的类型。
百分比值总是相对于另一个量，例如长度。每个允许百分比的属性也定义了百分比所参照的量。这个量可以是同一元素的另一个属性的值、祖先元素的属性值、包含块的度量，或其他东西。
例如，如果您将盒子的 width 指定为百分比，它指的是盒子父元素计算宽度的百分比
.box {
width: 50%;
}
混合百分比和维度
某些属性接受一个可以是两种类型之一的维度，例如 <length> 或 <percentage>。在这种情况下，允许的值在规范中被详细描述为一个组合单位，例如 <length-percentage>。其他可能的组合如下
特殊数据类型（在其他规范中定义）
颜色
图像
<image> 值指定可以在 CSS 中使用的所有不同类型的图像，并在 CSS 图像值和替换内容模块中定义。
位置
<position> 类型定义了对象在定位区域内的二维定位，例如容器内的背景图像。此类型被解释为 background-position，因此在 CSS 背景和边框规范中指定。
函数式表示法
函数式表示法是一种可以表示更复杂类型或调用 CSS 特殊处理的值类型。语法以函数名称开头，紧接着是左括号 (，然后是表示法的参数，最后是右括号 )。函数可以接受多个参数，其格式类似于 CSS 属性值。
括号内允许有空格，但不是必需的。（但请参阅关于 min()、max()、minmax() 和 clamp() 函数页面中有关空格的说明。）
一些旧的函数式表示法，例如 rgb()、rgba()、hsl() 和 hsla() 的旧语法，使用了逗号，但逗号通常只用于分隔列表中的项目。如果使用逗号分隔参数，逗号前后的空格是可选的。
规范还定义了 toggle() 函数。它尚未在任何地方实现。
规范
| 规范 |
|---|
| CSS 值和单位模块第 4 级 |