针对Iphone 7和7 plus的CSS媒体查询

Question

我需要检查一些特定于iphone 7和7 plus的附加CSS,iphone 6和iphone 7是否具有相同的物理高度/宽度？如果可能,请提及媒体查询.

Answer 1

http://stephen.io/mediaqueries/有针对特定Apple产品的媒体查询列表,但您应该尝试单独避免每个设备的样式,因为这会增加您需要大量写入的数量.您的问题可能是由使用的浏览器引起的,而不是特定设备引起的.在为一个设备设置样式之前检查一下.

这个网站表明它确实具有与iPhone 6相同的分辨率,因此相同的查询将同时针对两者.https://www.paintcodeapp.com/news/ultimate-guide-to-iphone-resolutions

iPhone 6的纵向和横向

@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 667px) { /* STYLES GO HERE */}

iPhone 6 Plus的纵向和横向

@media only screen 
and (min-device-width : 414px) 
and (max-device-width : 736px) { /* STYLES GO HERE */}