@media 查询是CSS中用于在样式表中根据设备属性或屏幕特性应用不同样式的规则。这使得你可以根据设备的特定条件，如屏幕宽度、高度、设备类型等，应用不同的样式。

基本的 @media 查询语法如下：
@media media-type and (media-feature) {
    /* CSS规则 */
}

其中：
  •  media-type 指定了媒体类型，例如 screen（屏幕）、print（打印机）、all（所有媒体）等。

  •  media-feature 指定了媒体类型的特定特征，例如 width（宽度）、height（高度）、min-width（最小宽度）、max-width（最大宽度）等。


举个例子，如果你想在屏幕宽度小于600像素的情况下应用特定的样式，可以这样写：
@media screen and (max-width: 600px) {
    /* 在屏幕宽度小于600px时应用的CSS规则 */
    body {
        font-size: 14px;
    }
}

这样，当屏幕宽度小于600像素时，文档中的字体大小将变为14像素。@media 查询可以根据需要包含多个条件，以适应不同的设备或屏幕属性。


转载请注明出处：http://www.zyzy.cn/article/detail/4217/CSS