css - iPad Pro 12.9 媒体查询不起作用

Question

我正在尝试为 iPad Pro 12.9 英寸版本实现以下媒体查询，但当我检查实际的 iPad 设备时它不起作用。

@media only screen   and (min-device-width: 1024px)   and (max-device-width: 1366px)   and (orientation: landscape)   and (-webkit-min-device-pixel-ratio: 2)
{
//CSS
}

上面的媒体查询在 Chrome 上工作，但是当我检查实际设备甚至 xCode 上的模拟器时，它不起作用。我也尝试过 (-webkit-min-device-pixel-ratio: 2 )。结果相同

Answer 1

这里是 iPad Pro 12.9 英寸的工作代码。 由于信息严重缺乏，我费了很大劲，但我现在找到了工作参数。

// For both Portrait and Landscape
@media only screen
    and (min-device-width: 768px)
    and (max-device-width: 2732px)
    and (-webkit-min-device-pixel-ratio: 2){
       // CSS HERE
}

// For landscape
@media only screen
    and (min-device-width: 768px)
    and (max-device-width: 2732px)
    and (orientation:landscape)
    and (-webkit-min-device-pixel-ratio: 2){
       // CSS HERE
}

// For Portrait
@media only screen
    and (min-device-width: 768px)
    and (max-device-width: 2732px)
    and (orientation:portrait)
    and (-webkit-min-device-pixel-ratio: 2){
       // CSS HERE
}