@media screen and (min-width:320px){
    html{
        font-size: 5px; !important;
    }
}
@media screen and (min-width:480px){
    html{
        font-size: 10px; !important;
    }
}
@media screen and (min-width:768px){
    html{
        font-size: 14px;!important;
    }
}
@media screen and (min-width:960px){
    html{
        font-size: 16px;!important;
    }
}
@media screen and (min-width:1200px){
    html{
        font-size: 18px;!important;
    }
}
@media screen and (min-width:1330px){
    html{
        font-size: 20px;!important;
    }
}
 

根據查詢到的尺寸來修改根元素html的font-size大小，初始定義為20px,

其餘的元素寬度採用百分比設定，高度或者一些div的寬高使用rem做單位，1 rem=20px;

簡單換算即可，通過媒體查詢動態修改根元素的大小，使得rem 一直在跟著變化，響應式就成功了。