移动设备上的最小字体大小不应该不于14px
,为标题提供最小字体大小
.title {
font-size: calc(14px + 2vw);
}
计算它的等效的 vw
vw = (Pixel Value / Viewport width) * 100
移动端滚动问题:即使使用100vh
,也会滚动,原因是地址栏的高度可见。
.my-element {
height: 100vh; /* 不支持自定义属性的浏览器的回退 */
height: calc(var(--vh, 1vh) * 100);
}
// 首先,我们得到视口高度,我们乘以 1% 得到一个vh单位的值
let vh = window.innerHeight * 0.01;
// 然后,将`--vh`自定义属性中的值设置为文档的根目录一个属性
document.documentElement.style.setProperty('--vh', `${vh}px`);
评论 (0)