引导程序对高分辨率手机没有响应

Question

我的网站使用引导程序3来容纳不同屏幕尺寸的设备。我使用bootstrap的hidden-xs类在小型设备上隐藏页面不必要的背景图像，使它们无需放大即可专注于重要的输入组件。如果您调整浏览器窗口的大小或调整显示器的分辨率，则效果很好。它在iPhone等低分辨率手机上也能很好地工作。

但是，由于引导程序使用屏幕像素大小，因此无法在具有高分辨率的android手机上使用。结果是，电话用户必须放大或努力选择合适的输入，因为它们在电话的物理小屏幕上显得很小。

是否有一个简单的解决方法，以使使用高分辨率电话的用户不会拥有与台式机用户相同的外观？

谢谢！

Answer 1

您可以使用此元标记

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

在<head>HTML文档的部分中，可以根据所使用设备的屏幕宽度缩放文档。

检查MDN以获取有关视口元标记及其用法的更多信息。