@media screen and (){} 注：and和括号中间要空一格,括号里min-width max-width是少于等于 或大于等于
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" type="text/css" href="css/s320.css" media="screen and (max-width:639px)"/>/*根据不同的设备引用不同的css样式文件*/
<link rel="stylesheet" href="css/s640.css" media="screen and (min-width:640px)"/>
<style>
@media screen and (max-width:540px){
body{
background-color: blue;
}
}
@media screen and (min-width: 541px){
body{
background-color: red;
}
}
@media screen and (min-width: 970px) {
body{
background-color: green;
}
}
</style>
</head>
<body>
<div>1
</div>
<div>2
</div>
</body>
</html>
