css中的media怎么用

CSS中的media是一个非常实用的属性，它可以帮助我们在不同的设备上优化网页的布局和样式。具体来说，media属性可以根据不同的媒体类型来为不同的设备提供不同的样式。

媒体类型是在CSS3中引入的，用于控制文档在不同媒体上的呈现效果。一般来说，我们最常用的媒体类型有以下几种：

@media screen { ... }
@media print { ... }
@media (min-width: 768px) { ... }
@media (max-width: 767px) { ... } 

第一种是最常见的媒体类型，它表示当前的媒体是屏幕。第二种是用于打印的样式，它在网页打印时起作用。第三种和第四种则是基于视口的媒体查询，用于针对不同的设备大小提供不同的样式。

通过media属性，我们可以在CSS中针对不同的媒体类型设置不同的样式。例如，我们可以为打印页面设置一些特定的样式：

@media print {
  body {
    font-size: 12pt;
  }
} 

在这个例子中，我们使用@media print选择器来指定只有在打印时才应用该样式。

除了上面提到的例子，media属性还可以用于调整页面布局和样式的其他部分，例如字体大小、颜色等等。这些调整都可以根据不同的媒体类型来设置，以适应不同的设备和浏览器。

需要注意的是，在使用media属性时，我们应该始终保持简洁明了的代码。尽量避免过多的媒体查询，以提高网页的效率和稳定性。