- 媒体查询(Media Queries)允许根据设备类型或媒体特性应用样式，如设备方向、显示比例、视口宽度和高度。
- 视口(viewport)是浏览器窗口的可见区域，可以调整桌面设备的视口大小，而移动设备通常不支持手动调整。
- 使用媒体查询可以为打印机(print)或屏幕(screen)等不同类型的媒体设备定制样式。
- 响应式网页设计(Responsive Web Design)依赖于媒体查询来为不同尺寸的设备提供适当的样式。
- 可以设置特定的样式仅在符合媒体查询条件时生效，例如为打印设备指定的样式。
- 通过使用CSS的@media规则，可以定义当视口宽度超过特定像素值时应用的样式，如将内容分栏展示。
- 调整浏览器的视口宽度会影响媒体查询的应用，如小于640像素时内容堆叠、大于1024像素时内容分三栏等。