前端学习之----媒体查询

1、iPhone X适配

@media only screen and (device- 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) {
    .videoTitleBox {
        margin-top: 0.6rem;
    }
}

2、iPhone Xr适配

@media only screen and (device- 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2) {
    .videoTitleBox {
        margin-top: 0.6rem;
    }
    .video_box {
        height: 28.5%;
    }
}