用于打印的頁面設計
當前位置:點晴教程→知識管理交流
→『 技術文檔交流 』
在網站的一些應用中需要提供用戶直接打印頁面的功能,最明顯的就是電子優惠券,商家根據網站提供的模板輸入內容,然后生成優惠券頁面,用戶打印這個頁面即是優惠券。 《style type=”text/css” media=”print”》 這里表示該style內引入或者定義的樣式屬性僅僅在打印的時候使用,這里提醒一下,如果沒有設置media屬性,那么定義的樣式將在瀏覽器和打印時都起效,所以建議將類似這樣的樣式放在所有常規樣式之后。比如我們希望在打印出來的頁面上有一行“打印與雅虎口碑網”,但在瀏覽器中并不現實: 《p class=”printTitle”》打印與雅虎口碑網《/p》 那么我們就可以在統一樣式中設置.printTitle{display:none;},而在后面的media為”print”的樣式中設置為.printTitle{display:block;}。在定義的打印樣式并不是在打印時的優先級會高于常規定義的樣式,所以再次建議將打印樣式放在所有常規樣式之后。 2.在頁面打印的時候瀏覽器的設置會對打印的效果有影響,在IE中的“工具”–“Internet選項”–“高級”中有一個“打印背景顏色和圖像”,類似的在Firefox中“文件”–“頁面設置”中有一個“打印背景顏色和圖像”,當這個選項被選中的時候,頁面中的背景顏色和圖片都可以打印出來(有些不標準的IE內核瀏覽器似乎有些問題,背景顏色可以打印出來,但是背景圖片不行),如果沒有選中則背景顏色和圖片都無法打印出來,所以為了屏蔽用戶不同的瀏覽器和瀏覽器設置,我建議兩點,第一是在用背景色填充的區域作為分界的地方加上1px的邊框,顏色和背景色一樣,這樣在瀏覽器中看不出來變化,而在打印的時候即使用戶的設置導致背景色無法打印出來也可以有一個邊框來作為分割,最大層的上保留了頁面格局;第二是對所有必不可少的圖片都使用《img/》標簽,這樣無論用戶瀏覽器怎么設置都可以將這些圖片打印出來,可能這樣與平時一些頁面設計方式不同,但為了統一打印的效果,也只要讓步了。 該文章在 2010/8/13 17:53:05 編輯過 |
關鍵字查詢
相關文章
正在查詢... |