iPad Pro 12.9媒体查询无效

时间:2017-10-06 17:01:13

标签: css media-queries

我正在尝试为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)。相同的结果

1 个答案:

答案 0 :(得分:2)

此处为12.9英寸iPad Pro的工作代码。 由于信息的匮乏,我付出了很多努力,但我现在找到了工作参数。

// 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
}
相关问题