我正在使用屏幕分辨率为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/