媒体查询 @media screen

@media screen 是CSS中的一种媒体查询方式。它用于指定在屏幕设备上应用特定的CSS样式。通过@media screen，开发人员可以根据屏幕的宽度、高度、分辨率等属性，为不同尺寸的屏幕提供不同的样式。

例如，可以使用@media screen 来创建一个响应式设计，使页面在不同尺寸的屏幕上呈现不同的布局和样式。在@media screen 中，我们可以使用特定的CSS规则来定义在特定条件下应用的样式。

下面是一个示例，展示了如何在@media screen 中定义一个简单的样式规则：

@media screen and (max-width: 600px) {
  body {
    background-color: red;
  }
}

在这个示例中，当屏幕宽度小于或等于600像素时，背景颜色会变为红色。这样，我们可以针对不同的屏幕尺寸应用不同的样式，以提供更好的用户体验。