為什麼 Chrome 的列印預覽中不顯示我的表格的背景顏色？

列印預覽不包含背景顏色

列印網頁時，指定的背景顏色可能無法出現在列印預覽中。具體來說，表格指定的背景顏色未在 Chrome 的列印預覽中顯示。

已套用下列CSS 屬性，但未成功：

-webkit-print-color-adjust: exact;

解決問題

雖然CSS 屬性print-color-adjust:exact;功能正常，有基本的故障排除步驟可確保所需的CSS 在列印時生效。

1. 將列印與螢幕CSS 分開：

   • 實作媒體查詢以區分用於列印的CSS 樣式(@media print)和用於螢幕顯示的CSS 樣式(@media screen)。

2. 增加CSS 特異性：

   • 在這種情況下， print-color-adjust 屬性起作用，但其他具有更高特異性的CSS 規則會覆蓋它。要解決此問題，請在 @media 列印規則中使用 !important 聲明：

@media print {
    tr.vendorListHeading {
        background-color: #1a4567 !important;
        print-color-adjust: exact; 
    }
}

@media print {
    .vendorListHeading th {
        color: white !important;
    }
}

以上是為什麼 Chrome 的列印預覽中不顯示我的表格的背景顏色？的詳細內容。更多資訊請關注PHP中文網其他相關文章！