/*>=0,<960的设备屏幕*/
@media screen and (min-width: 0px) and (max-width: 959px){
body {
font-size: 12px;
background-color: aquamarine;
}
}
/*>=960,<1024的设备屏幕*/
@media screen and (min-width: 960px) and (max-width: 1023px) {
body {
font-size: 12px;
background-color: red;
}
}
/*>=1024,<1280的设备屏幕*/
@media screen and (min-width: 1024px) and (max-width: 1279px){
body {
font-size: 14px;
background-color: yellow;
}
}
/*>=1280,<1440的设备屏幕*/
@media screen and (min-width: 1280px) and (max-width: 1439px) {
body {
font-size: 18px;
background-color: green;
}
}
/*>=1440,<1680的设备屏幕*/
@media screen and (min-width: 1440px) and (max-width: 1679px){
body {
font-size: 20px;
background-color: cyan;
}
}
/*>=1680,<1920px的设备屏幕*/
@media screen and (min-width: 1680px) and (max-width: 1919px) {
body {
font-size: 24px;
background-color: yellowgreen;
}
}
/*>=1920的设备屏幕*/
@media (min-width: 1920px) {
body {
font-size: 30px;
background-color: hotpink;
}
}
搭配postcss-px2rem使用，适配各种PC尺寸，完美！！！