css - 媒体查询：屏幕 > 1024

Question

我正在尝试在站点中应用媒体查询，但我的知识并不深入这个主题，所以基本上我想在检测到的屏幕大于 1024*768 时将特定样式应用于标签。

我做了这个

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

}

但我必须确定分辨率何时大于 1024

Answer 1

尝试这个：

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


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

Answer 2

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

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

Answer 3

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

Answer 4

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

html { 背景：红色；} }