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