如何打印内联CSS样式?

发布于 2024-11-29 10:28:50 字数 262 浏览 0 评论 0原文

有没有办法打印内联的CSS样式?

我使用此代码来打印部分代码:

w=window.open();
w.document.write($('#printable').html());
w.print();
w.close();

我可以使用外部文件并将其设置为 media=print,但 html 的一部分是由 php 生成的字符,我可以通过为每个可能的结果创建类来实现它,但是那会很痛苦。

有什么想法吗?谢谢。

is there a way to print css styles, that are inline?

I use this code to print part of the code:

w=window.open();
w.document.write($('#printable').html());
w.print();
w.close();

I could use external file and make it media=print, but part of the html are chars, that are generated by php and I could make it by making class for every posible outcome, but that would be pain.

Any ideas? Thanks.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

失退 2024-12-06 10:28:50

请参阅演示:http://jsfiddle.net/rathoreahsan/x69UY/

如果您这样做:

<div id="printableDiv">
    <style type="text/css">
        @media print {
            #printable { 
               color: red; 
               // Any Other style you want to add 
             }
        }
    </style>
    <div id="printable">
        This Text will print in red color.
    </div>
</div>

Javascript/jQuery 代码:

w=window.open();
w.document.write($('#printableDiv').html());
w.print();
w.close();

在这种情况下,当弹出窗口打开并获取 printableDiv 的 HTML 时,打印机的样式将包含在该弹出窗口中,以便打印机将从中读取样式弹出窗口并将以这种方式打印。

See the Demo: http://jsfiddle.net/rathoreahsan/x69UY/

What do you think if you do like this:

<div id="printableDiv">
    <style type="text/css">
        @media print {
            #printable { 
               color: red; 
               // Any Other style you want to add 
             }
        }
    </style>
    <div id="printable">
        This Text will print in red color.
    </div>
</div>

Javascript/jQuery code:

w=window.open();
w.document.write($('#printableDiv').html());
w.print();
w.close();

In this scenario while a popup opens and gets the HTML of printableDiv, the styles for printer will be included in that popup so the printer will read styles from popup and will print in that manner.

烟雨凡馨 2024-12-06 10:28:50

我遇到了同样的问题,因为我使用 instyle 样式动态更改背景颜色,然后颜色不在打印中。
styleSheets[3] 是我的 print.css 文件。

这对我有用:
我将它排除在我用来给某些元素设置背景颜色的 smarty foreach 中。

<script type='text/javascript'>
  document.styleSheets[3].insertRule(" #caldiv_<?smarty $item.calendar_id ?> { border-color:<?smarty $item.color ?> }", 1);
</script>

I had the same problem, because i use instyle style to dynamically change background-color, and then the color was not in the print.
styleSheets[3] is my print.css file.

This worked for me:
I uncluded it in the smarty foreach i use to give some elements a background color.

<script type='text/javascript'>
  document.styleSheets[3].insertRule(" #caldiv_<?smarty $item.calendar_id ?> { border-color:<?smarty $item.color ?> }", 1);
</script>

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文