一、手机端自适应rem
(1)样式重置、定义字体大小
/*样式重置这块省略，大同小异*/
/*定义字体大小*/
@media screen and (min-width:320px) {
html {
font-size:42.66px;
}
body {
font-size:12px;
}
}@media screen and (min-width:360px) {
html {
font-size:48px;
}
body {
font-size:12px;
}
}@media screen and (min-width:375px) {
html {
font-size:50px;
}
body {
font-size:12px;
}
}@media screen and (min-width:384px) {
html {
font-size:51.2px;
}
body {
font-size:14px;
}
}@media screen and (min-width:400px) {
html {
font-size:53.34px;
}
body {
font-size:14px;
}
}@media screen and (min-width:414px) {
html {
font-size:55.2px;
}
body {
font-size:14px;
}
}@media screen and (min-width:424px) {
html {
font-size:56.54px;
}
body {
font-size:14px;
}
}@media screen and (min-width:480px) {
html {
font-size:64px;
}
body {
font-size:15.36px;
}
}@media screen and (min-width:540px) {
html {
font-size:72px;
}
body {
font-size:17.28px;
}
}@media screen and (min-width:720px) {
html {
font-size:96px;
}
body {
font-size:23.04px;
}
}@media screen and (min-width:750px) {
html {
font-size:100px;
}
body {
font-size:24px;
}
}（2）html页面里面写上以下meta
<meta name="viewport" content="width=750,user-scalable=no" />(3)这里的750rem宽就是100%宽