媒体查询：屏幕 > 1024

Question

我试图在一个网站中应用媒体查询，但我对这个主题的了解不够深入，所以基本上我想在检测到屏幕宽度大于1024*768时对一个标签应用特定的样式。

我做了这个：

@media screen and ( device-width: 1024px ) {

}

但我必须识别分辨率是否大于1024

- m4g4bu

---

高度是否相关？你的标签中已经有了答案，你尝试过“CSS媒体查询”吗？ - Wesley Murch

Answer 1

尝试这个：

@media only screen and (min-width : 1025px) {
    .classname {
        /* styles here */
    }
}


@media only screen and (max-width : 1024px) {
    .classname {
        /* other styles here */
    }
}

- Mike Brant

Answer 2

使用标准的媒体屏幕查询。一旦宽度达到1024像素或更大，查询将触发样式更改。

@media screen and (min-width: 1024px) {
    /* Styles go here */
    #layout {
        width: 90%;
    }
}

- Stieffers

Answer 3

@media all and (min-width: 1024px) {
  #css {
    foo : bar;
  }
}

- Ties

Answer 4

@media (min-width: 1024px) and (max-width: 1920px) {

html { background: red; } }

- user3690329

---

你能否添加一些解释说明你的代码是做什么的，以及它与其他答案有何不同？ - Cray