当前位置：
首页>
科技>
能源 > 说明 1px、1em、1rem、1vw、1vh 的区别
说明 1px、1em、1rem、1vw、1vh 的区别
时间:2025/9/13 6:32:24来源：https://blog.csdn.net/weixin_52401264/article/details/139303455 浏览次数:2次
说明 1px、1em、1rem、1vw、1vh 的区别
| 单位（units） | px | em | rem | vw | vh |
|---|
| 相对单位/绝对单位 | 绝对 | 相对 | 相对 | 相对 | 相对 |
| 含义 | 像素 | 相对于父元素字体大小（倍数） | 相对于根元素字体大小（倍数） | 相对于视口的宽度（百分之 1 的倍数） | 相对于视口的高度（百分之 1 的倍数） |
| 举例 | - | 父元素字体大小 16px，
则子元素中 1em=16px | 根元素字体大小 16px，
则当前元素中 1rem=16px | 视口宽度为 1000px，则 1vw=10px | 视口高度为 500px，则 1vh=5px |
- 通常来说，
html 元素是根元素 - 1
vw 相当于视口宽度的 1%；1 vh 相当于视口高度的 1%
关键字：说明 1px、1em、1rem、1vw、1vh 的区别
版权声明:
本网仅为发布的内容提供存储空间，不对发表、转载的内容提供任何形式的保证。凡本网注明“来源：XXX网络”的作品，均转载自其它媒体，著作权归作者所有，商业转载请联系作者获得授权，非商业转载请注明出处。
我们尊重并感谢每一位作者，均已注明文章来源和作者。如因作品内容、版权或其它问题，请及时与我们联系，联系邮箱：809451989@qq.com，投稿邮箱：809451989@qq.com
责任编辑：
