javascript - 通过手机查看时隐藏网站的一部分

Question

在我的模板 html 中，我想向使用手机查看网站的用户隐藏

标记中的一些内容。我们可以用 javascript 做到这一点以及如何做到吗？请指教，谢谢。

Answer 1

您可以使用 media queries 来实现此目的。人们通常会这样做:

@media (max-width: 480px) {
    .hidden_mobile {
        display: none;
    }
}

使用上面的媒体查询，如果元素具有 hidden_​​mobile 类并且屏幕尺寸小于 480px - example here，则该元素将被隐藏。 。因此，您只需将此类添加到您想要在移动设备上隐藏的所有元素即可。

<小时/>

值得注意的是，如果您希望它在移动设备上运行，则应该设置视口(viewport)。

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