CSS -- media响应式布局

用min-width时，小的放上面大的在下面，同理如果是用max-width那么就是大的在上面，小的在下面

@media (min-width: 1024px){ /*>=1024的设备*/
      body{font-size: 18px}
} 

@media (min-width: 1100px) { /*>=1024的设备*/
      body{font-size: 20px}
} 

@media (min-width: 1280px) {
      body{font-size: 22px;}
} 

@media (min-width: 1366px) {
      body{font-size: 24px;}
}  

@media (min-width: 1440px) {
      body{font-size: 25px;}
} 

@media (min-width: 1680px) {
      body{font-size: 28px;}
} 

@media (min-width: 1920px) {
      body{font-size: 33px;}
}