/* 方法一 */
@media screen and (min-width: 1024px) {
html {
font-size: 10px;
}
}
@media screen and (min-width: 1100px) {
html {
font-size: 12px;
}
}
/* @media (min-width: 1280px) { html{font-size: 22px;} } */
@media screen and (min-width: 1280px) {
html {
font-size: 12px;
}
}
@media screen and (min-width: 1366px) {
html {
font-size: 13px;
}
}
@media screen and (min-width: 1440px) {
html {
font-size: 14px;
}
}
@media screen and (min-width: 1680px) {
html {
font-size: 16px;
}
}
@media screen and (min-width: 1920px) {
html {
font-size: 20px;
}
}
@media screen and (min-width: 2048px) {
html {
font-size: 20px;
}
}
@media screen and (min-width: 2560px) {
html {
font-size: 26px;
}
}
@media screen and (min-width: 4096px) {
html {
font-size: 40px;
}
}
/* 方法二 */
/*屏幕大于1200排序（大屏幕電腦）*/
@media screen and (min-width: 1200px){html{font-size: 19px;}}
/*屏幕在1024px到1199之間（中屏幕電腦）*/
@media screen and (min-width: 1024px) and (max-width: 1199px){html{font-size: 19px;}}
/*屏幕在768px到1023之間（小屏幕-pad）*/
@media screen and (min-width: 768px) and (max-width:1023px){html{font-size: 14px;}}
/*屏幕在480px到768之間（主要是手機屏幕）*/
@media screen and (max-width: 768px){}
ie8兼容
<script src="https://cdn.bootcss.com/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
