css 媒体类型 怎么使用

CSS的媒体类型（media type）是CSS规范中提供的一组属性，可以根据不同的媒体展现不同的样式。在Web设计中，媒体类型可以用于控制在不同的设备、分辨率和屏幕尺寸上如何渲染网页。

@media screen {
body {
    background-color: blue;
    color: white;
}
}

在上面的示例中，我们使用@media规则指定了css样式应用于哪种媒体类型，如“screen”表示应用于屏幕，而不是打印介质。特别地，我们定义了当渲染屏幕时，文档的背景颜色和文本颜色分别为蓝色和白色。

@media print {
body {
    font-size: 12pt;
}
p {
    page-break-after: avoid;
}
}
    

在另一个示例中，我们使用了@media规则针对打印媒体做出了一些样式调整。这里我们利用print媒体类型将文档的默认字体大小改为12pt，并避免了段落被打印时被分割成两页。

媒体类型除了分屏媒体（例如屏幕和打印机）之外，还有一些其他的媒体类型，如声音和触摸屏幕等。这些媒体类型可以被用于更具体的设备和场景，以便根据需要进行更好的页面设计。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！