CSS3中引入了打印樣式表（Print Media），它允許您在文檔打印時應用不同的樣式。print樣式表可用於指定頁面樣式，例如文本大小，選擇的顏色和背景圖案，以及其他打印特定樣式信息。在這篇文章中，我們將詳細介紹CSS Print Media的各個方面。

打印媒體樣式表可以在HTML文檔中使用link元素，如下所示：

在這個例子中，我們告訴瀏覽器，我們的樣式表是使用print媒體的。

下面是一些CSS屬性，你可以在打印時應用它們。這些屬性可以與特定的類一起使用。

1. page-break-after：使打印時頁面分頁

@media print {
    .page-break { 
        page-break-after: always;
    }
}

2. font-size：可以在打印時指定字體大小

@media print {
    body { font-size: 10pt }
}

3. color：可以在打印時指定文字顏色

@media print {
    body { color: #000000 }
}

下面是一個例子，展示了如何使用CSS Print Media為打印樣式指定樣式：

@media print {
body {
font-size: 11pt;
}
h1 {
color: blue;
}
.author {
display: none;
}
}

The Title of the Page

Welcome to the page, we hope you enjoy your stay.

Written by John Smith

在這個例子中，我們設置了打印時的字體大小為11pt，標題顏色為藍色，而作者的信息被隱藏了。

在打印時，頁面的大小可能會影響樣式表的效果。默認情況下，頁面大小為A4，因此我們需要確認我們的打印樣式是否適用於A4頁面大小。

但是，在某些情況下，您可能需要通過媒體查詢來更改特定頁面的大小，例如：

@media print and (width: 16cm) and (height: 24.7cm) {
    /* 設置樣式 */
}

結論：

CSS Print Media非常有用，可以讓您調整HTML元素以適應打印頁面的大小和方向，以及其他打印細節，如顏色和字體大小等。我們可以在打印時，指定不同的樣式來優化用戶體驗，並且可以針對不同的打印頁面設置不同的打印樣式。

原創文章，作者：TMUJ，如若轉載，請註明出處：https://www.506064.com/zh-hant/n/131919.html

CSS Print Media簡介