@media 查询不适用于移动设备.在 Chrome 中运行良好 [英] @media query not working in mobile. Works fine in Chrome

问题描述

我正在尝试使其正常工作，但不知何故它在移动设备中不起作用.当我使用 chrome 工具覆盖屏幕尺寸时，它工作正常.我不确定我做错了什么.请帮忙

I am trying to get this working but somehow its not working in mobile. when i use chrome tool to overrides the screen size, it works fine. i am not sure what i am doing wrong. please help

@media screen and (min-device-width : 320px) and (max-device-width : 480px) {
            .container .backgroundImage { display: none; }
}

在浏览器中查看时有背景图片.我想在移动设备中查看时删除该图像，但不知何故它不起作用..请帮忙

There is a background image when viewed in browser. s i would like to remove that image when viewed in mobile BUT its not working somehow.. please help

==============

=============

推荐答案

@Andy 是对的，仔细检查你的 device-widths，或者你总是可以使用 min-width 这样您就不必知道每个设备宽度.

@Andy is right, double check your device-widths, or you could always just use min-width so you don't have to know every device width.

无论如何确保你有一个 viewport 标签，比如 <meta name="viewport" content="width=device-width,initial-scale=1.0">.

Regardless make sure you have a viewport tag, like <meta name="viewport" content="width=device-width,initial-scale=1.0">.

这篇关于@media 查询不适用于移动设备.在 Chrome 中运行良好的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！