CSS媒体查询是用于响应式布局设计中的常用技术之一。它可以根据不同的设备屏幕大小和分辨率，为不同的设备提供不同的样式效果，以适应多种设备的视觉体验。下面就是一个关于CSS媒体查询的案例。

@media screen and (max-width: 768px) {
/*定义屏幕最大宽度为768px时的样式*/
body {
background-color: #0080FF;
}
h1 {
font-size: 24px;
color: #ffffff;
}
p {
font-size:16px;
color:#ffffff;
}
}
@media screen and (max-width: 480px) {
/*定义屏幕最大宽度为480px时的样式*/
body {
background-color: #ff9e05;
}
h1 {
font-size: 18px;
color: #000000;
}
p {
font-size:14px;
color:#000000;
}
}

如上代码所示，该媒体查询实现了两个分界点。当页面宽度小于等于768px时，会应用第一个媒体查询，背景色为蓝色，标题和正文为白色，字体大小分别为24px和16px。当浏览区域为小于等于480px时，会应用第二个媒体查询，背景色为橙色，标题和正文颜色为黑色，字体大小分别为18px和14px。

这个案例表明，在不同的设备尺寸下，通过CSS3的媒体查询技术，能够为用户提供更加优秀的视觉和使用体验，也能方便网站的制作者进行响应式布局设计。