css 通过rem和媒体查询适配各个设备屏幕

/*默认参照iphone6*/

html {
    font-size: 16px;
}
/*适配iphone5*/
@media screen and (max-width: 320px){
    html {
        font-size: 13.65px !important;
    }
}
/*适配iphone6plus*/
@media screen and (min-width: 376px) and (max-width: 414px){
    html {
        font-size: 17.66px !important;
    }
}
/*适配ipad*/
@media screen and (min-width: 415px) and (max-width: 768px){
    html {
        font-size: 32.76px !important;
    }
}
/*适配ipad pro*/
@media screen and (min-width: 769px) and (max-width: 1024px) {
    html{
        font-size: 43.69px !important;
    }
}

你可能感兴趣的:(css 通过rem和媒体查询适配各个设备屏幕)