rem 转 vh

一个根据给定 rem 尺寸和视口高度计算 vh 的转换器,使测量结果具备响应式特性

REM
REM 大小
视口高度

快捷键

C

计算并复制计算结果。

V

计算结果。

B

复制计算结果。

R

将转换器切换为「VH 转 REM」。

Q

聚焦「REM」输入框。

W

聚焦「REM 大小」输入框。

E

聚焦「视口高度」输入框。

FAQ

如何将 REM 转换为 VH?

要将 rem 转换为 vh,您需要知道 1 REM 的总大小(默认 16px)和视口高度 然后套用公式:((rem * rem 大小) / vh) * 100 例如,1rem = 16px、视口高度 = 1000px 时,1rem 转换结果为:((1 * 16) / 1000) = 1.6vh

REM 转 VH 的公式是什么?

((rem * rem 大小) / vh) * 100

什么是rem单位?

REM是相对于根元素的字体大小定义的。根元素通过:root伪类或html选择器来匹配。因此,1 REM取的是根元素font-size所赋的值。这意味着1 REM在你的整个CSS代码中保持相同的值。

什么是vh单位?(视口高度)

视口高度(VH)用于响应式设计,是相对于网页显示区域(称为视口)的一个单位。 1vh相当于显示区域的1%。因此,要让一个元素达到全高,你应该使用100vh。 你也可以使用小数值。请注意,根据浏览器的不同,小数精度可能会有所变化。

rem 大小为 16px、视口高度为 1080px 时的 REM 转 VH 换算表

remvh
1rem1.481vh
2rem2.963vh
3rem4.444vh
4rem5.926vh
5rem7.407vh
6rem8.889vh
7rem10.37vh
8rem11.852vh
9rem13.333vh
10rem14.815vh
11rem16.296vh
12rem17.778vh
13rem19.259vh
14rem20.741vh
15rem22.222vh
16rem23.704vh
17rem25.185vh
18rem26.667vh
19rem28.148vh
20rem29.63vh
21rem31.111vh
22rem32.593vh
23rem34.074vh
24rem35.556vh
25rem37.037vh

更多 REM 和 VH 转换

rem 转 vh