这是我参与「第四届青训营 」笔记创作活动的第十六天
1. 长度取值 Length Data Types
| 长度取值 | 版本 | 描述 |
|---|---|---|
<length> | CSS2 | <number>接长度单位。 |
长度单位 Length Units
文本相对长度单位 Font-relative Length Units
| 长度单位 | 版本 | 描述 |
|---|---|---|
| em | CSS1 | 相对于当前对象内文本的字体尺寸 |
| ex | CSS1 | 相对于字符“x”的高度。通常为字体高度的一半 |
| ch | CSS3 | 数字“0”的宽度 |
| rem | CSS3 | 相对于根元素(即html元素) font-size 计算值的倍数 |
视口相对长度单位 Viewport-relative Length Units
| 长度单位 | 版本 | 描述 |
|---|---|---|
| vw | CSS3 | 相对于视口的宽度。视口被均分为100单位的vw |
| vh | CSS3 | 相对于视口的高度。视口被均分为100单位的vh |
| vmax | CSS3 | 相对于视口的宽度或高度,总是相对于大的那个。视口的宽度或高度被均分为100单位的vmax |
| vmin | CSS3 | 相对于视口的宽度或高度,总是相对于小的那个。视口的宽度或高度被均分为100单位的vmin |
绝对长度单位 Absolute Length Units
| 长度单位 | 版本 | 描述 |
|---|---|---|
| cm | CSS1 | 厘米 |
| mm | CSS1 | 毫米 |
| q | CSS3 | 1/4毫米(quarter-millimeters); 1q = 0.25mm |
| in | CSS1 | 英寸(inches); 1in = 2.54cm |
| pt | CSS1 | 点(points); 1pt = 1/72in |
| pc | CSS1 | 派卡(picas); 1pc = 12pt = 1/6in |
| px | CSS1 | 像素(pixels); 1px = 1/96in |
2. 角度取值 Angle Data Types
| 角度取值 | 版本 | 描述 |
|---|---|---|
<angle> | CSS3 | <number>接角度单位。 |
角度单位 Angle Units
| 角度单位 | 版本 | 描述 |
|---|---|---|
| deg | CSS3 | 度(Degrees) |
| grad | CSS3 | 梯度(Gradians) |
| rad | CSS3 | 弧度(Radians) |
| turn | CSS3 | 转、圈(Turns) |
特殊布局取值 Layout-specific Data Types
| 特殊布局取值 | 版本 | 描述 |
|---|---|---|
<fraction> | CSS3 | <number>接剩余空间数单位。 |
<grid> | CSS3 | <number>接网格数单位。 |
特殊布局单位 Layout-specific Units
| 特殊布局单位 | 版本 | 描述 |
|---|---|---|
| fr | CSS3 | 剩余空间分配数 |
| gr | CSS3 | 网格数 |
颜色值 Color Data Types
| 名称 | 版本 | 描述 |
|---|---|---|
<color> | CSS1/CSS3 | 用来表示颜色的关键字或者数值规则 |
| Color Name | CSS1 | 用颜色名称来指定颜色。包括基本颜色关键字、系统颜色、SVG颜色关键字等 |
| HEX | CSS1 | 十六进制记法。语法如:#rrggbb或#rgb |
| RGB | CSS2 | rgb记法 |
| RGBA | CSS3 | rgba记法 |
| HSL | CSS3 | hsl记法 |
| HSLA | CSS3 | hsla记法 |
| transparent | CSS1/CSS3 | 全透明 |
| currentColor | CSS3 | 当前颜色 |