HTML/CSS - 打印樣式，背景不會顯示？

我在製作網站時遇到了一些麻煩，與在瀏覽器中查看它完全相同，無法打印。它看起來不錯，唯一讓我陷入困境的是它拒絕顯示背景。圖像很好，但它只是背景。我還沒有嘗試設置圖像作爲背景，但這不應該是必要的，對吧？HTML/CSS - 打印樣式，背景不會顯示？

我將背景應用於DIV元素，使用十六進制顏色（如果有的話）。

有沒有辦法解決這個問題？我搜索了它，但我沒有發現任何人有同樣的問題。

謝謝！

來源

2010-10-21 Nike

某些瀏覽器在打印時可能會忽略背景，以節省墨水。 – You 2010-10-21 17:29:52

正在打印或不打印的背景圖像不是您可以通過CSS強制的：它是瀏覽器的設置，大多數（如果不是全部）瀏覽器默認爲'而不是'。

來源

2010-10-21 17:33:07 djn

嗯，沒關係。有什麼解決方法嗎？我沒有設置圖像作爲背景，我只是設置了一個純色，但我不認爲這很重要。 – Nike 2010-10-21 17:39:46

我認爲沒有（除非您很好地邀請您的訪問者更改其瀏覽器設置）。作爲一個非常普遍的規則，背景材料應該用於裝飾元素等。如果您的背景包含信息內容，您可以將其製作爲圖像（我的意思是一個IMG元素） - 這將被打印 - 並在必要時用許多「圖像替換」技術之一隱藏文本內容。 – djn 2010-10-21 20:32:43

您可以嘗試使用兩個單獨的元素（例如段落和圖像），然後將圖像的z索引設置爲低於段落的z索引，然後將圖像完全放置在內容後面。但我會建議不要打印背景。否則，你會搞亂用戶的期望，人們可能會感到惱火。

來源

2010-10-21 17:54:38

我可能會給你一個鏡頭。我沒有爲整個頁面設置背景，我只是將它設置爲表格標題。我不認爲他們會因此而感到惱火。 :) – Nike 2010-10-21 18:01:31

良好的通話。實際上，在桌面標題上顯示背景很有意義......嗯......我必須做一些頭腦風暴，看看我能否想出一個更有效的方法來做到這一點。另一個想法是，您可以在包含所需文本和背景的表格標題中使用圖像。只要確保你使用正確的替代文字，如果你使用這種方法。 – 2010-10-21 21:21:12

許多瀏覽器的好處是，如果您在黑色背景上有白色文本，例如，當您在沒有背景的情況下打印時，瀏覽器會將您的文本顏色更改爲黑色。 – 2010-10-26 18:04:11

默認情況下，許多瀏覽器不打印背景圖像和顏色。您需要在打印選項中啓用該功能。 Chrome並沒有這樣的選擇，但做一個WebKit的瀏覽器（Safari瀏覽器，谷歌瀏覽器）打印背景圖像或顏色，你應該在以下CSS樣式添加到該元素：

-webkit-print-color-adjust: exact;

來源

2012-07-02 15:43:59

這適用於我們內部支持的瀏覽器列表。頂級尊重。 – RSG 2013-07-24 18:39:28

CSS：box-shadow: inset 0 0 0 1000px gold;

廠適用於所有瀏覽器和表格單元格和行。

來源

2013-10-03 04:28:28 KDawg

這與所問的問題有什麼關係？他們詢問有關未打印的背景圖像。 box-shadow如何以任何方式與*相關*？ – 2013-10-08 07:19:54

@Andrew，這個技巧非常完美：盒子的陰影變成背景，然後它被打印出來！ – Guillaume 2014-01-13 15:43:16

嗯，@Guillaume;我現在明白了。編輯過的額外說明也有幫助。感謝您糾正我！ – 2014-01-13 15:48:30

HTML/CSS - 打印樣式，背景不會顯示？

回答

相關問題