代码之家  ›  专栏  ›  技术社区  ›  Noel Omondi

iPad Pro 12.9媒体查询不起作用

  •  2
  • Noel Omondi  · 技术社区  · 8 年前

    我正在尝试为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 回复  |  直到 8 年前
        1
  •  3
  •   Tormy Van Cool    7 年前

    这里是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
    }