html - @media 取决于缩放系数？

Question

我试图理解 CSS 中的 @media ，似乎 max-width 与屏幕分辨率无关，但窗口大小本身，这里是代码:

@media (max-width: 2000px) {
div
{
width:100px;
height:100px;
background:red;
}
}

@media (max-width: 1000px) {
div
{
width:100px;
height:100px;
background:blue;
}
}

缩放 100%:

但是，缩放 150%

我在 Chrome 和 Firefox 上试过，同样的事情发生了。

那么独立于缩放因子控制 CSS 的正确代码是什么？

Answer 1

不要只看最大宽度，@media 以不同的方式工作。我通过学习这个很棒的教程和示例来学习如何使用它:[ http://css-tricks.com/css-media-queries/]