css的media规则 |圆角背景 css3

@media screen {
/*CSS for computer screens*/
}
@media handheld {
/*CSS for mobile or handheld devices*/
}
@media print {
/*CSS for printed pages*/
}

在上述代码中，大家使用了三个常用的media类型：screen、handheld和print。

当媒介类型为screen时，表示该样式表适用于计算机屏幕上的网页。大家可以在这个media规则下编写针对电脑设备的CSS代码，控制字体大小，行距，颜色等等。

当媒介类型为handheld时，表示该样式表适用于手机或平板等手持设备，大家可以创建一个与计算机屏幕不同的布局设计，用于更好地适应手机设备的尺寸和显示效果。

当媒介类型为print时，表示该样式表适用于打印内容，在这个media规则下，大家可以专门设置一些打印相关的样式，例如控制页面边距，字体大小等等。

除了上述三种媒介类型，大家还可以针对其他媒介类型编写CSS样式表，如all、aural、braille、embossed等等。

@media all and (max-width:600px) {
/*CSS for devices under 600px wide*/
}

在media规则中，大家还可以使用媒介查询来控制不同的视图大小，例如上述代码中，大家限制了媒介类型为all（适用于所有媒介类型），同时添加了一个视图宽度小于600px的条件限制。这样，大家可以为小型设备提供更符合其显示效果的样式。

最后，通过media规则，大家可以为不同的媒介类型编写出更加适合的样式，使得网页在不同设备上都可以获得更好的显示效果和用户体验。