我正在使用屏幕分辨率为1600x900的PC。
这是我的代码:

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
    <title>Page title</title>

    <style type="text/css">
        @media screen and (max-device-width : 600px) {
            body { background-color:#F00; }
        }
    </style>
</head>

<body></body>
</html>


问题是我正在尝试开发该网站的一个回收版本,并且在开发过程中想在PC上使用Chrome。我期望当我将浏览器的大小调整为小于600px的宽度时,媒体查询将运行,但似乎认为我的设备宽度为1600px,并且它永远不会改变。在计算机上调整窗口大小时,如何触发媒体查询?

最佳答案

@media screen and (max-device-width : 600px) {http://jsfiddle.net/7rSzr/删除“设备”

进行中:

@media screen and (max-width : 600px) {
    body { background-color:#F00; }
}

关于css - 调整浏览器窗口大小时,Chrome不会更改设备宽度,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/17431436/

10-11 23:25
查看更多