打印 iframe 不包含 CSS

【问题标题】：printing iframe doesn't include CSS打印 iframe 不包含 CSS
【发布时间】：2019-03-19 15:03:55
【问题描述】：

我有一个iframe，其中包括<button onclick="print()">print</button>

var print = function(){
    parent.window.focus();
    window.print();
}

当我单击<button> 时，打印开始，但 CSS 不包含在打印中。如何强制浏览器将我的 CSS 包含在打印中？

【问题讨论】：

【解决方案1】：

iframe 内的页面 CSS 必须具有必要的 print CSS media query 才能按当前浏览器中显示的方式打印。

即

@media print {
    #my-element {
        color: red;
        /* all the styles you need */
    }
}

【讨论】：

我将它包含在<link rel="stylesheet" type="text/css" media="print" href="print.css" /> 中，但甚至没有显示屏幕css