在网页设计中，要考虑到不同设备的屏幕大小和分辨率。为了解决这个问题，css引入了媒体查询（media query）的概念，以适应不同的设备和屏幕。

媒体查询可根据不同的条件匹配设备的特定属性，如屏幕宽度、高度、方向等。以下是一个简单的例子：

@media screen and (min-width: 480px) {
body {
background-color: lightgreen;
}
}

这个媒体查询的条件是指：当屏幕宽度大于或等于480像素时，应用样式“background-color: lightgreen”到body元素。

除了screen，还有其他的媒体类型可供选择，如print（打印机）、speech（语音）等等。媒体查询还可以通过逻辑运算符and、or、not来组合条件。

媒体查询可以在CSS文件中嵌套使用，也可以在HTML文件中嵌入style标签，如下所示：

在这个例子中，当屏幕宽度小于或等于600像素时，应用样式“font-size: 16px”到body元素。

在移动设备越来越普及的今天，媒体查询已经成为网页设计中必不可少的一部分。适当地使用它可以帮助网页在不同的设备上呈现出最佳的效果。