单位在使用不同类型描述长度值时,需要附加单位。不同的单位表示的含义是不同的 在 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实现登录案例 2023-02-23
- AJAX实现无刷新检测用户名功能 2023-02-13
- vue-vuex-mutations的基本使用 2023-10-08
- html粘性页脚的具体使用 2022-09-21
- AJAX+Servlet实现的数据处理显示功能示例 2023-02-14
- 关于Vue中的计算属性和监听属性详解 2023-07-10
- css3溢出隐藏的方法 2022-11-23
- ajax无刷新评论功能 2023-01-26
- 深入浅析Jsonp解决ajax跨域问题 2022-12-28
- 四步轻松实现ajax发送异步请求 2023-02-14