这是一个包含简单媒体查询的CSS代码段。
http://codepen.io/anon/pen/nuxaw
当我缩小页面以至于视口小于320时,方框会变成绿色。现在如果我按以下步骤操作,浏览器会被最大化,但是CSS仍然会保持在320px定义的媒体查询状态下:
- 在第一个标签打开页面,并将浏览器大小调整到启用< 320px媒体查询的尺寸
- 打开新标签,浏览一个网站,比如facebook.com。
- 最大化浏览器。
- 在第一个标签不活跃的情况下进行一次长时间的浏览会话。
- 激活最大化的第一个标签。
- 此时,视口应该是全屏的,但元素仍应该是绿色块。
这意味着<320媒体查询仍然适用。但如果你打开调试器,你会发现应用的CSS是正常的CSS。这是Chrome的一个bug吗?
这是一个在imgur上展示了序列的相册。
- 已打开,已最大化。
- 缩小视口,启用媒体查询。
- 最大化,仍使用媒体查询。
- 查看CSS,其中显示尺寸为300x200,但UI显示为100x100。某些东西出错了。