iphone的移动视图问题

Question

我对 iphone 上的移动视图有疑问。在安卓设备上一切正常。我也试过为iphone xr设置具体的宽度和高度，但还是不行。

我已经在谷歌移动友好测试中测试了我的网站，一切正常。

这是我的代码，适用于最大宽度为 700px 的 android 设备：

body {
       background-image: url('/wp-content/uploads/2020/08/ass-1.png');
       background-repeat: no-repeat;
       background-position: center center;
       background-attachment: fixed;
       background-size: cover;
   }   
   
   
   @media screen and (max-width: 700px) { 
 body {
   background-image: url('/wp-content/uploads/2020/08/mobiledevicelogo2.png');
     background-position: fixed;
     background-repeat: no-repeat;
     background-size: cover;
 }

Answer 1

iPhone XR 分辨率为max-width:414px

更多信息：https://www.emailonacid.com/blog/article/email-development/emailology_media_queries_demystified_min-width_and_max-width/

@media screen and (min-width: 414px) { 
 body {
   background-image: url('/wp-content/uploads/2020/08/mobiledevicelogo2.png');
     background-position: fixed;
     background-repeat: no-repeat;
     background-size: cover;
 }