如何使用@media 打印查询导入打印样式表？

【问题标题】：How to import printing stylesheet using @media print query?如何使用@media 打印查询导入打印样式表？
【发布时间】：2013-12-16 07:24:39
【问题描述】：

我想将我的打印样式表移动到一个单独的文件中，以便使用@media 查询导入。我尝试了以下方法，但它似乎不起作用，至少在 Chrome 上：

h1 {
....
}

....

@media screen {
....
}

@media print {
 @import "print.css";
}

我该怎么做？

【问题讨论】：

【解决方案1】：

@import 自己支持媒体类型和媒体查询，因此您可以将媒体查询传递到@import 语句中，而不是将其嵌套在@media 规则中：

@import "print.css" print;

此外，您不能将@import 语句添加到样式规则中，因此在这种情况下，您需要将它一直放在最上面。如果由于级联原因不能这样做，则不能使用@import；您需要使用 <link media="print"> 元素或类似元素来包含打印样式表。

【讨论】：