css水果机媒介查询适配

爱吃栗子的小单

于 2019-08-16 15:01:58 发布

阅读量173

点赞数

分类专栏：微信小程序 css

本文链接：https://blog.youkuaiyun.com/weixin_40820061/article/details/99678325

版权

微信小程序同时被 2 个专栏收录

7 篇文章

订阅专栏

css

2 篇文章

订阅专栏

本文提供了一套针对iPhoneX、iPhoneXS、iPhoneXS Max及iPhoneXR等设备的屏幕适配方案，利用媒体查询精确匹配各型号手机的尺寸与像素密度，确保网页在不同iPhone型号上呈现一致的视觉效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

/*iphoneX、iphoneXS适配*/
@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) {}

/*iphoneXS Max适配*/
@media only screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3) {}

/*iphoneXR 适配*/
@media only screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2) {}