iPhoneX，iPhoneXR，iPhoneXS Max刘海适配问题

通过css匹配到XR来设置样式，但是XR的适配一直出现问题，和网上的帖子一模一样，结果发现网上的帖子写错了，只能自己测试出来的匹配规则，虽然也不知道是否正确，毕竟不是做app原生开发的，但是可以适配XR

viewport-fit=cover

/* X、XS机型的媒体查询 */
@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) {
}
/* XS MAX机型媒体查询 */
@media only screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3){
}
/* XR机型媒体查询 */
@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 2){
}

网上XR的device-width是414px，device-height是896px，发现不能用，设置成和X一样能进到对应的样式