把XHTML CSS頁面轉換成為印表機頁面

2021-04-01 06:31:47 字數 1679 閱讀 2158

把xhtml/css頁面轉換成為印表機頁面

2004-03-23 03:3 pm

在以前,為web頁面建立乙個印表機友好的版本意味著要設計乙個布局和格式都經過修改的單獨頁面,這樣才能夠在列印的時候獲得令人滿意的效果。現在,通過使用結構化的xhtml和css,你可以實現同樣的效果而只用花費少得多的精力。

從螢幕顯示到列印效果

大多數的web頁面都是設計適用於在計算機螢幕上**的。然而,有的時候使用者需要將某些頁面列印出來,也許就是為了保留乙個長期的記錄,或者將其用作方便的離線參考資料。

現在的麻煩是,讓web頁面在計算機彩色螢幕上看起來引人注目和五彩繽紛的很多特性,都無法在列印版的web頁面上表現出相同的效果——尤其當印表機是黑白的時候。在被降級為灰度列印的時候,彩色的組合會失去(原有的)對比效果;圖形會看起來失真,而且耗費太長的列印時間;在web頁面上起著重要作用的導航按鈕在列印頁面上也毫無用處。

為了克服這些問題,web的建立者常常會為頁面專門設計乙個印表機友好的版本,這樣訪問者就有列印的慾望。印表機友好的版本通常都包括有和主要web頁面相同的內容,但是會省略掉大多數的圖形、背景和導航元素。頁面還會把彩色轉換成某種形式,以便生成能夠讓人接受的灰度影象。

css的解決方案

使用結構化的xhtml標示和css格式將內容和表示分離開來的乙個優勢在於,通過更改css樣式,你可以很輕易就把內容重新格式化。因此,建立乙個印表機友好的頁面就是把乙個不同的css檔案鏈結到相同的xhtml頁面上。

你可以同時把螢幕樣式表和列印樣式表鏈結到同乙個xhtml檔案裡,所以就沒有必要單獨建立乙個印表機友好的頁面,只需要乙個印表機友好的樣式表就行了。當你在鏈結**裡加入多**型別的檔案時,這就是在告訴瀏覽器為了進行螢幕輸出要遵循或者忽略哪些css的規則,而為了列印輸出要使用哪些規則。

如果需要支援老版本的瀏覽器,那你就必須堅持使用css1的**描述符screen和print。它們是相互排斥的,因此在為螢幕顯示而生成頁面的時候,瀏覽器會忽略掉列印樣式表,反之亦然。所以,每個樣式表都需要包含相同的樣式選擇器,但是有不同的規則宣告,以便為不同的輸出裝置分別生成頁面樣式。

簡化的css

如果你願意放棄照顧老版本的瀏覽器,並假設你的使用者正在使用支援css2的瀏覽器(比如說ie5及以上版本或者***scape 6及以上版本),你可以使用新的all**描述符來極大地簡化css**。

這些鏈結幾乎和前面的完全一樣;不同之處在於css檔案裡包含有用於列印**的樣式。

css檔案裡同media="all"聯絡在一起的樣式可以應用於螢幕顯示、列印,以及其他所有的**,所以你可以把所有建立的樣式都放到這個檔案裡。同media="print"單獨聯絡在一起的css檔案可以小得多,因為頁面從所有的**檔案繼承了所有的樣式,這就沒有必要再複製列印**檔案裡的這些樣式了。

列印**css檔案裡唯一需要的樣式是那些為列印輸出而更改或者新增頁面樣式。一般來說,這只不過是一些禁止顯示包含有圖形和導航內容的div的樣式,和把主體標籤以及主要div的寬度和空白設定替換成適合列印輸出的設定。

這個技巧能夠起作用是因為所有的**css檔案和列印**css檔案都組合成了相同的層疊樣式規則。因此,對這些css檔案的鏈結順序相當重要。所有的**檔案鏈結都必須要放在列印**檔案鏈結之前。

當你需要為自己的訪問者提供乙個印表機友好的web頁面,你不再需要為原有的頁面建立乙個單獨的版本。新增乙個對帶有media="print"**描述符的css樣式表的鏈結,就能夠把任何xhtml/css頁面轉換成為乙個印表機友好的頁面。

10 轉換成為整數

使用內建函式 int 將資料轉換成整數 a 10 b int a 將字串變數 a int轉換成整數 print a str print b int print a 1 錯誤 print b 1 10 1 如果字串不是乙個合法的數字會出錯 a hello b int a print b 錯誤 x 1a...

把Word轉換成pdf程式

using oword microsoft.office.interop.word private void wordconvert new object 對應指令碼中的word.printout false,false,0,psfile 的引數 退出word 對應指令碼中的word.quit wo...

把man手冊轉換成中文

4 完成日期 2015 年 6 月 6 日 5 版 本 號 v1.0 6 學習主題 把man手冊轉換成中文 7 使用環境 紅帽5.8 8 使用好處 10 如何使用 11 學習內容 安裝man pages中文手冊包 靈雲星火 步驟 2 設定語言環境為中文 檢視本機的語言環境 echo lang 如果不...