如何為要被列印的內容設定CSS樣式屬性

有時候我們要列印的內容也是需要美觀度的，並不希望太原汁原味了，所以要對其進行一下樣式設定，本章節就簡單介紹一下，如何利用CSS設定要被列印內容的樣式，方式有多種，下面一一做一下簡單介紹。

一.使用link引入外部樣式表:

[HTML] 純文字檢視 複製程式碼
<link rel="stylesheet" href="css/style.css" media="screen" />

以上程式碼的CSS樣式用於螢幕顯示效果，對於列印無效。關鍵在於media屬性值。

[HTML] 純文字檢視 複製程式碼
<link rel="stylesheet" href="css/style.css" media="print" />

以上程式碼的樣式程式碼可以用於列印內容。

二.import方式引入樣式表:

[HTML] 純文字檢視 複製程式碼
<style type="text/css">
@import url("css/printstylesheet.css") print;
</style>

以上程式碼引入的樣式可以用於列印樣式。

三.螢幕顯示和列印在同一個檔案中:

[CSS] 純文字檢視 複製程式碼
@media print{
  h1{
    color:black;
  }
  h2{
    color: gray;
  }
}
div{color:red}