@media screen and (min-width: 720px) {
body {
background-color: skyblue;
}
}上面的媒体查询指定了两个条件：
必须在普通屏幕（而不是打印的页面，投影仪等）上查看页面。
用户视口的宽度必须至少为720像素。
如果满足这些条件，则媒体查询中的样式将处于活动状态，并且页面的背景颜色将为天蓝色。
媒体查询是动态应用的。如果在页面加载中满足了媒体查询中指定的条件，则将应用CSS，但是如果不再满足条件，则会立即将其禁用。相反，如果最初不满足条件，则在满足指定条件之前将不应用CSS。
在我们的示例中，如果用户的视口宽度最初大于720像素，但用户缩小了浏览器的宽度，则当用户将视口的尺寸调整为小于720像素时，背景颜色将不再是天蓝色。宽度。