我有以下 html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link href="main.css" rel="stylesheet" type="text/css" />
</head>
<body>
<span class="print">Print only</span> - <span class="noprint">Display Only</span>
</body>
</html>
main.css
@import url("screen.css") screen;
@import url("print.css") print;
屏幕.css
.print
{
display:none;
}
打印.css
.noprint
{
display: none;
}
span.print
{
display: inline !important;
}
div.print
{
display: block !important;
}
当我在浏览器中查看页面时，如预期的那样显示“仅显示”跨度，而“仅打印”跨度不显示。
但是，当我进入打印预览或打印页面时，它似乎没有使用 print.css？
我正在使用 IE8，我认为它支持@import？
最佳答案
显然 IE 不支持 @import 行末尾的“打印”。 改用这个:
@import url("screen.css");
@import url("print.css");
然后将“@media”规则添加到样式表中。
@media print
{
.noprint
{
display: none !important;
}
span.print
{
display: inline !important;
}
div.print
{
display: block !important;
}
}
关于css - 从@import 加载的打印样式表不起作用？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/7782813/