Javascript 为什么我的CSS没有打印？_Javascript_Css

Javascript 为什么我的CSS没有打印？

javascript css

Javascript 为什么我的CSS没有打印？,javascript,css,Javascript,Css,我试图通过创建一个新的窗口元素来打印DIV的内容，该元素包含我想要打印的html。一切正常，css样式在打印预览窗口上正确显示，但当窗口实际打印到文件或打印机时，样式将丢失。我怀疑print（）事件是在加载css之前触发的，但不确定如何修复此问题这是我的js代码 function printDiv (elem) { var popup = window.open('','','width=800,height=500,toolbar=no, menubar=no');

我试图通过创建一个新的窗口元素来打印DIV的内容，该元素包含我想要打印的html。一切正常，css样式在打印预览窗口上正确显示，但当窗口实际打印到文件或打印机时，样式将丢失。我怀疑print（）事件是在加载css之前触发的，但不确定如何修复此问题

这是我的js代码

  function printDiv (elem)
  {
    var popup = window.open('','','width=800,height=500,toolbar=no, menubar=no');
    popup.document.writeln('<!DOCTYPE html>');
    popup.document.writeln('<html><head><title></title>');
    popup.document.writeln('<link rel="stylesheet" type="text/css" href="/assets/css/main.css">');
    popup.document.writeln('</head><body class="popup-body">');
    popup.document.writeln(elem.html());
    popup.document.writeln('</body>');
    popup.document.writeln('</html>');
    popup.print();
    popup.close();
}

函数printDiv（elem）
{
var popup=window.open（''，''，宽度=800，高度=500，工具栏=no，菜单栏=no'）；
popup.document.writeln（“”）；
popup.document.writeln（“”）；
popup.document.writeln（“”）；
popup.document.writeln（“”）；
popup.document.writeln（elem.html（））；
popup.document.writeln（“”）；
popup.document.writeln（“”）；
popup.print（）；
popup.close（）；
}

您可以使用

@media

在打印时添加样式，

@media print

您可以通过设置超时来延迟文档的打印，如

比如说

  setTimeout(
    function(){ 
       popup.print(); 
       popup.close();
  }, 1000);

这将在加载窗口1000毫秒（1秒）后打印文档。请注意，您还必须延迟关闭窗口。

使用setTimeout（popup.print）您可以尝试使用

@media screen，在/assets/CSS/main.CSS中围绕CSS样式打印
  setTimeout(
    function(){ 
       popup.print(); 
       popup.close();
  }, 1000);