CSS 单位

em 根据父元素的字体大小变化。

1
2
3
4
5
6
7
8
9
10
11
12
13
<style>
body{
font-size: 14px;
}
div{
font-size: 1.2em;
}
</style>
<body>
<div class="test">
Test
</div>
</body>

rem 根据根元素的字体大小变化。

1
2
3
4
5
6
7
8
<style>
body{
font-size: 14px;
}
div{
font-size: 1.2rem;
}
</style>

vw 显示窗口的宽度
vh 显示窗口的高度
vmin 和 vmax 宽度和高度的最大值或最小值有关(如果宽度为1100px高度为700px 那么 1vmin 是 7px,1vmax 是 11px 反之亦然。)

1
2
3
4
5
6
<style>
body{
width: 100vw;
height: 100vh;
}
</style>

ex和ch单位 这两个单位只也依赖于font-family,因为它们被定为基于特殊字体的法案。


相关资料
CSS的一些单位,如rem、px、em、vw、vh、vm
七个你可能不了解的CSS单位

You need to set client_id and slot_id to show this AD unit. Please set it in _config.yml.