css - 如何使用 CSS 覆盖各种浏览器的打印首选项？

Question

我有以下CSS：

   @@media only print {
            @@page {
                size: A4 landscape !important;
                margin-top: 0mm !important;
                margin-bottom: 0mm !important;
            }
                #tblPrint tbody tr:nth-child(even) {
                    background-color: #ededed !important;
                }
            * {
                -webkit-print-color-adjust: exact !important;
            }
}

问题如下：

1. @@page 属性并非对所有浏览器都生效，默认浏览器的打印首选项生效，即（Chrome：A4/Landscape）、（Edge：A4/Portrait）、（IE：A4/Portrait），甚至当我将 size 属性翻转为 size: A3 Portrait !important; 相同的默认浏览器的打印首选项继续生效。

2. 由于我使用了“-webkit-print-color-adjust”，所以即使我从浏览器的打印首选项中关闭了“背景图形”功能，背景色属性也会在 Chrome 上生效，但是在 IE 上不起作用除非我从浏览器的打印首选项中打开“打印背景颜色和图像”功能，否则边缘浏览器无法使 background-color CSS 属性生效。

我需要的解决方案是强制我的 CSS 指定的属性覆盖浏览器的打印首选项，而无需用户指定纸张大小、方向并从浏览器检查“背景图形/打印背景颜色和图像”所有浏览器的打印首选项，请帮忙！！

标签： csswebprintingcross-browsermedia-queries

Answer 1

添加样式表的底部

css

@media print { 
    body{ background-color:#000;}
}