写移动端网站时常常要考虑iPhone X系列底部加高，就会用到媒体查询
/* iPhone X 和 iPhone XS */
@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) {
}
/* iPhone XR */
@media only screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2) {
}
/* iPhone XS Max */
@media only screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3) {
}
【参考文章】
https://stackoverflow.com/questions/52321212/iphone-xr-xs-xs-max-css-media-queries
