CSS长度单位：px、ex、vh、vw、vmin、vmax、em、rem
px
相对长度单位。像素（Pixels）。
1in = 2.54cm = 25.4 mm = 101.6q = 72pt = 6pc = 96px
ex
相对长度单位。相对于字符“x”的高度。通常为字体高度的一半。
如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。
vh、vw
v（viewpoint）也就是说vh、vw直接对应的是当前视口的尺寸。
width:100vh;
height:100vh;
width:100%;
height:100%;
说明：
- 如果浏览器高度为1000px，宽度为800px，那么1vh=1000/100=10px，1vw=800/100=8px；
- 而 %要受到父元素的约束，并不能直接根据浏览器的尺寸计算。
vmin、vmax
vmin表示当前宽和高的小者，vmax则表示当前宽和高的大者。
em和rem
em
相对长度的单位，相对于当前对象内文本的字体尺寸。
如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。
rem
相对长度单位。
r（root）通常指标签，也就是只要用rem作为单位，都会以标签的设置为基础。
相对于根元素(即html元素)font-size计算值的倍数
<body>
<div>
Test <!-- 14 * 1.2 = 16.8px -->
<div>
Test <!-- 16.8 * 1.2 = 20.16px -->
<div>
Test <!-- 20.16 * 1.2 = 24.192px -->
</div>
</div>
</div>
</body>
<style>
body {
font-size: 14px;
}
div {
font-size: 1.2em; // calculated at 14px * 1.2, or 16.8px
}
</style>
也就是说这样设置的话，每层都要看它的父元素，而这并不总是我们想要的，rem可以来补充em不足。
q
1/4毫米（quarter-millimeters）。绝对长度单位。
1in = 2.54cm = 25.4 mm = 101.6q = 72pt = 6pc = 96px
in
英寸（Inches）。绝对长度单位。
1in = 2.54cm = 25.4 mm = 101.6q = 72pt = 6pc = 96px
pt
点（Points）。绝对长度单位。
1in = 2.54cm = 25.4 mm = 101.6q = 72pt = 6pc = 96px
pc
派卡（Picas）。绝对长度单位。相当于我国新四号铅字的尺寸。
1in = 2.54cm = 25.4 mm = 101.6q = 72pt = 6pc = 96px
cm/mm
厘米/毫米
原文地址：https://blog.csdn.net/lianghecai52171314/article/details/142744962
免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！