自訂獨特的列印專用樣式

文章內容轉貼自NiceType

很多時候，讀者們經常會把一些網路上看到的好文章，
或是具有參考價值的內容給列印下來，
這時候我們可以自訂一個專門給列印用的佈景主題，
除了讓列印的人驚喜外，還更加深對您網誌的印象呢!!
而且，還能加上只有在列印才會出現的文字喔!! 甚至將 sidemenu,comments 等都隱藏不被列印出來….
快快自訂一個列印專用的獨特佈景主題吧!

首先，
在您的佈景主題樣式庫中，新增一個自訂的樣式表，
在這個樣式表中在加入列印專門的樣式，
可以參照先前的文章：新增一個常用的樣式給你的網誌…!!

以這裡為例，新增的樣式語法為:

/* -----------------------------------
For Print Style
-----------------------------------*/
p.forPrinted {display:none}
@media print {
p.forPrinted {
display:block;
font:9pt/140% verdana;
letter-spacing:2px;
border:1px solid #999999;
padding:9pt;
margin:9pt 4px;
width:100%;
}
#siderMenu, #comments,#commentEditor,
#toolsbar,#copyright,#navlinktop,#navlinkbottom {display:none}
}

接下來我們在文章編輯的下方接著，寫下只有列印時才要出現的文字訊息:

<p class="forPrinted">
如果你對本文有興趣，請連上網站：nicetypoR Professional Official website
網址：http://www.nicetypo.com
</p>

接下來說明一下: 新增的列印樣式中，第一行
p.forPrinted{display:none}
指的是讓 p.forPrinted 標籤內的文字 display:none ，也就是不顯示於網頁上!!
接著 @media print 內的 p.forPrinted 則是唯有被列印時要顯示的樣式..
另外~##siderMenu, #comments 等ID…也可以看到是 display:none，也是說…列印時，將這些 ID 下的內容統統隱藏不顯示..

p.forPrinted 是可自訂的，但 @media print 是不可以自訂的!!