单位在使用不同类型描述长度值时，需要附加单位。不同的单位表示的含义是不同的 在 CSS 中具有 2 种不同类型的长度单位：绝对长度单位相对长度单位 绝对长度单位所描述的长度任何其他因素是无关的，是固定、不变...
单位
在使用不同类型描述长度值时，需要附加单位。不同的单位表示的含义是不同的
在 CSS 中具有 2 种不同类型的长度单位：
- 绝对长度单位
- 相对长度单位
绝对长度单位
所描述的长度任何其他因素是无关的，是固定、不变化的。
| 单位 | 名称 | 等价换算 |
|---|---|---|
| cm | 厘米 | 1cm = 96px/2.54 |
| mm | 毫米 | 1mm = 1/10th of 1cm |
| Q | 四分之一毫米 | 1Q = 1/40th of 1cm |
| in | 英寸 | 1in = 2.54cm = 96px |
| pc | 十二点活字 | 1pc = 1/16th of 1in |
| pt | 点 | 1pt = 1/72th of 1in |
| px | 像素 | 1px = 1/96th of 1in |
相对长度单位
相对长度单位所描述的长度一般会具有一个明确的参照物，例如父级元素、根元素或视口大小等。
所以在视觉上会随着参照物尺寸的变化而变化，对不同尺寸设备的适配也相对会更友善。
| 单位 | 相对于 |
|---|---|
| em | 父元素的字体大小 |
| ex | 字符“x”的高度 |
| ch | 数字“0”的宽度 |
| rem | 根元素的字体大小 |
| lh | 元素的line-height |
| vw | 视窗宽度的1% |
| vh | 视窗高度的1% |
| vmin | 视窗较小尺寸的1% |
| vmax | 视图大尺寸的1% |
转自：简书_HTML中的单位
沃梦达教程
本文标题为：前端面试题 - HTML 中的长度单位
猜你喜欢
- ajax跳转到新的jsp页面的方法 2023-02-14
- vue使用动态组件实现TAB切换效果完整实例 2023-07-09
- 详解JS中continue关键字和break关键字的区别 2022-08-31
- 写给小白学习的地理信息的表示法GeoJSON 2023-07-09
- vuex Getters基本用法 2023-10-08
- 最新JS正则表达式验证邮箱和手机号实例(2022) 2022-10-21
- 纯vue3实现的svg可视化web组态编辑器。主要用于物联网mqtt实时系统图 2023-10-08
- 浅谈HTML5 服务器推送事件（Server-sent Events） 2022-09-16
- HTML5本地存储和本地数据库实例详解 2022-09-16
- JavaScript中FontFace对象的使用方式 2022-10-22
