android - Nexus 5 上的 CSS 媒体查询

Question

我在我的 nexus 5 上发现了一些奇怪的行为 - 还是我做错了什么？

我在带有小显示器（或纵向视图）的移动设备上使用这个 css 来获得更大的字体

html {
    font-size: 14px; 
}

@media screen and (max-width : 800px) {
    html{
        font-size: 20px;
    }
}

在我的 nexus 5 上以纵向视图加载页面时，它看起来就像它应该：20px 字体大小。现在，当将手机转为横向视图时，它会变为 14px。到目前为止，一切都很好。

现在将手机转回纵向视图时，字体大小保持 14 像素。为什么？我的错？

Answer 1

我不确定，但是您是否设置了视口元标记？

<meta name="viewport" content="width=device-width, initial-scale=1.0" />