ios web 媒体查询兼容

原文：https://blog.csdn.net/dear_zx/article/details/82785250

防止链接丢失，复制一下

兼容iphone4/4s：

@media (device-height:480px) and (-webkit-min-device-pixel-ratio:2){ } 
兼容iphone5 ：

@media (device-height:568px) and (-webkit-min-device-pixel-ratio:2){ } 
兼容iphone6，iphone7，iphone8s ：

@media (device-height:667px) and (-webkit-min-device-pixel-ratio:2){ }
兼容iphone6 Plus,iphone7 Plus,iphone8 Plus：

@media (device-height:736px) and (-webkit-min-device-pixel-ratio:2){ } 
兼容iphoneX：

@media only screen and (device- 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3){ }
 

兼容ipad ：

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px){ /* style */ } 
兼容ipad横屏 ：

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape){ /* style */ }
兼容ipad竖屏 ：

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait){ /* style */ }