DIV样式表的打印内容不起作用
[英]Print Contents of a DIV stylesheet not working
问题描述
Cant get the stylesheet to work on the printed document. 
无法获得样式表以在打印的文档上工作。 It works on the popup window but not when printed. 它在弹出窗口上起作用，但在打印时不起作用。 So when the window on the screen pops up it has the proper styling but when the print dialog is used the print the contents of the window it does not take the styling from the stylesheet just default styles. 因此，当屏幕上的窗口弹出时，它具有正确的样式，但是当使用打印对话框打印窗口内容时，它不会采用样式表中的样式，而只是采用默认样式。
Here is the code: 这是代码：
<html>
<head>
<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery- 1.3.1.min.js" > </script>
<script type="text/javascript">
function PrintElem(elem)
{
Popup($(elem).html());
}
function Popup(data)
{
var mywindow = window.open('', 'my div', 'height=400,width=600');
mywindow.document.write('<html><head><title>my div</title>');
mywindow.document.write('<link rel="stylesheet" href="main.css" type="text/css" />');
mywindow.document.write('</head><body >');
mywindow.document.write(data);
mywindow.document.write('</body></html>');
mywindow.print();
mywindow.close();
return true;
}
</script>
</head>
<body>
<div id="mydiv">
This will be printed. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Pellentesque a quam at nibh adipiscing interdum. Nulla vitae accumsan ante.
</div>
<a href="#" onclick="PrintElem('#mydiv')">Printout</a>
3 个解决方案
解决方案1
0 2013-05-02 07:33:17
如果要设计打印页面，则该页面不适用于样式表，您需要编写内联样式表。
解决方案2
0
I have face the same problem and finally solved that this is code : 我遇到了同样的问题，最后解决了这是代码：
<html> <head> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" type="text/css" /> </head> <body> <div id="mydiv"> This will be printed. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque a quam at nibh adipiscing interdum. Nulla vitae accumsan ante. </div> <a onClick="PrintElem('#mydiv')" class="btn btn-default btn-icon icon-left hidden-print pull-left"> My Div <i class="entypo-print"></i> </a> <script type="text/javascript"> function PrintElem(elem) { Popup($('<div/>').append($(elem).clone()).html()); } function Popup(data) { var myWindow = window.open('', 'my div', 'height=400,width=600'); myWindow.document.write('<html><head><title>my div</title>'); myWindow.document.write('</head><body >'); myWindow.document.write(data); myWindow.document.write('</body></html>'); myWindow.print(); myWindow.close(); return true; }; </script> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js" > </script> </body> </html>
解决方案3
0 2017-01-22 07:29:40
Print pages are usually used inside email as well. 打印页面通常也用于电子邮件中。 Based on what I experienced, you should write all your stylesheet codes within the code (inline). 根据我的经验，您应该在代码中（内联）编写所有样式表代码。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.