The first: The root element is 100px, and then converted into VW unit according to 750 design draft, so long as the design draft unit/2 can be. If it is a small program, you do not need to divide by 2.
html{ font-size: 26.66vw; //移动端适配 这里使用rem+vw方案 省去媒体查询 }
The second kind: Media query according to 750 design draft, the root element is 100px, compatibility is better.
html { font-size: 625%; /*100 ÷ 16 × 100% = 625%*/}@media screen and (min-width:360px) and (max-width:374px) and (orientation:portrait) { html { font-size: 703%; }}@media screen and (min-width:375px) and (max-width:383px) and (orientation:portrait) { html { font-size: 732.4%; }}@media screen and (min-width:384px) and (max-width:399px) and (orientation:portrait) { html { font-size: 750%; }}@media screen and (min-width:400px) and (max-width:413px) and (orientation:portrait) { html { font-size: 781.25%; }}@media screen and (min-width:414px) and (max-width:431px) and (orientation:portrait){ html { font-size: 808.6%; }}@media screen and (min-width:432px) and (max-width:479px) and (orientation:portrait){ html { font-size: 843.75%; }}
Mobile-adapted REM