@media screen and (max-width: 800px){ body { background-color: pink; }} @media screen and (max-width: 500px){ body { background-color: red; }} 小于800时是粉色,继续小于500时是红色。 由大到小 用max 由小到大 用min 建议
@media screen and (max-width: 800px){
body {
background-color: pink;
}
}
@media screen and (max-width: 500px){
body {
background-color: red;
}
}
小于800时是粉色,继续小于500时是红色。
由大到小 用max
由小到大 用min
建议从小到大
动态加载css
<link rel="stylesheet" href="style320.css" media="screen and (min-width: 320px)"><link rel="stylesheet" href="style640.css" media="screen and (min-width: 640px)">当屏幕小于640时会加载style320.css样式当屏幕大于640时会加载style640.css样式