媒体查询仅适用于 iphone 6s plus答案

【问题标题】：media query only for iphone 6s plus媒体查询仅适用于 iphone 6s plus
【发布时间】：2023-03-04 03:32:01
【问题描述】：

是否有任何仅针对 iphone 6s plus 的媒体查询。我的代码在 iphone 6plus 上运行良好，但在 iphone 6s plus 上存在一些问题。有没有办法为 iphone 6s plus 编写特定的媒体查询。

任何帮助将不胜感激。

【问题讨论】：

您甚至可以针对 iPhone/iPod 版本而不是 iOS 版本（7.x、8.x 和/或 9.x）吗？否则，最好检测功能而不是浏览器或更差的设备（Modernizr 来拯救！）或来自browserhacks.com 的一些记录在案的黑客（他们与 PostCSS 一起使用 CSS ）。最坏情况UA detection
嘿，我想这里已经问过了：stackoverflow.com/questions/25759046/…

【解决方案1】：

横向

@media only screen 
    and (min-device-width : 414px) 
    and (max-device-width : 736px)
    and (width : 736px) 
    and (orientation : landscape) 
    and (color : 8)
    and (device-aspect-ratio : 414/736)
    and (aspect-ratio : 736/414)
    and (device-pixel-ratio : 3)
    and (-webkit-min-device-pixel-ratio : 3)
    { }

肖像

@media only screen 
    and (min-device-width : 414px)
    and (max-device-width : 736px)
    and (width : 414px)
    and (height : 736px)
    and (orientation : portrait) 
    and (device-aspect-ratio : 414/736)
    and (aspect-ratio : 414/736)
    and (device-pixel-ratio : 3)
    and (-webkit-min-device-pixel-ratio : 3)
    { }

【讨论】：

【解决方案2】：

对于风景：

/* IPHONE 6 Plus Detection */
@media only screen 
    and (min-device-width : 414px) 
    and (max-device-width : 736px) 
    and (orientation : landscape) 
    and (-webkit-min-device-pixel-ratio : 3) 
    {
        /* code */
    }

肖像：

@media only screen 
    and (min-device-width : 414px) 
    and (max-device-width : 736px)
    and (device-width : 414px)
    and (device-height : 736px)
    and (orientation : portrait) 
    and (-webkit-min-device-pixel-ratio : 3) 
    and (-webkit-device-pixel-ratio : 3)
    {
        /* code */
    }

【讨论】：

欢迎来到 Stack Overflow！虽然欢迎使用此代码 sn-p，并且可能会提供一些帮助，但它将是 greatly improved if it included an explanation 的如何和 为什么 这可以解决问题。请记住，您正在为将来的读者回答问题，而不仅仅是现在提问的人！请edit您的答案添加解释，并说明适用的限制和假设。