如何使用CSS自定義瀏覽器打印時的頁眉和頁腳？

瀏覽器打印：自定義頁眉頁腳的技巧

很多時候，我們需要在瀏覽器打印網(wǎng)頁時，自定義頁眉和頁腳內(nèi)容。雖然window.print()本身無法直接控制打印頁眉頁腳，但我們可以利用css樣式來實現(xiàn)類似效果。

首先，需要明確一點：瀏覽器打印功能主要由瀏覽器自身控制，JavaScript無法直接修改其默認(rèn)打印設(shè)置。但是，我們可以通過CSS樣式巧妙地影響打印輸出。

CSS樣式自定義頁眉：

CSS的@page規(guī)則是關(guān)鍵。它允許我們定義頁面的樣式，包括頁眉和頁腳。

立即學(xué)習(xí)“前端免費學(xué)習(xí)筆記（深入）”；

以下示例展示如何使用CSS自定義頁眉：

@page {   @top-left { content: "左上角頁眉"; }   @top-center { content: "頂部中間頁眉"; }   @top-right { content: "右上角頁眉"; } }

將以上代碼添加到你的CSS文件中。打印時，瀏覽器會根據(jù)這些規(guī)則在頁面頂部相應(yīng)位置顯示自定義的頁眉內(nèi)容。 需要注意的是，這并非直接修改瀏覽器打印設(shè)置，而是通過控制打印樣式來達到效果。 實際效果可能因瀏覽器而異。

總結(jié)：

雖然window.print()函數(shù)不提供直接修改頁眉頁腳的API，但通過CSS的@page規(guī)則，我們可以有效地控制打印輸出的樣式，從而實現(xiàn)自定義頁眉頁腳的效果，提升打印輸出的專業(yè)性和可讀性。 記住，不同瀏覽器對CSS打印樣式的支持程度可能略有差異。

以上就是如何使用CSS自定義