當然,換皮之前你需要先按W3C標準建好你的網站,并且為它準備兩套表現不一樣的CSS。“換皮”實質上就是“換CSS”,我們要做的,只是用某種方法讓瀏覽器載入另一套CSS,重新渲染頁面。方法有很多種,我就介紹最常見的三種。
方法一:什么也不干
啊?什么也不干?嗯,這個……準確地說是:就干那么一丁點兒 (你還真以為有這么好的事兒呀……)。
假設我們有兩套CSS,分別封閉在兩個不同的文件中:a.css和b.css。然后在
和之間加入如下兩行XHTML代碼:然后用你的Firefox打開這個頁面,在菜單欄中選擇:查看 -> 頁面風格,應該可以看到如下的“風景”:
就這么簡單,現在你就可以用Firefox來“換皮”了。IE?IE沒這個功能……MS就是這么拽,W3C“明文推薦”:要求瀏覽器提供給用戶自己選擇樣式表的權力,可它就不這么干。幸運的是這件事也不是太難雜,咱就代勞一下吧。
[separator]
方法二:Javascript
在方法一的基礎上,可以用Javascript的DOM方法訪問link對象,再將不需要的CSS設為“禁用(disabled)”,剩下的CSS就會被瀏覽器用來渲染頁面。腳本如下,請注意其中的注釋:
然后在合適的地方調用這個函數,以本頁為例,添加如下兩個按鈕:
使 用Javascript的好處是方便、快捷、簡單,缺點也是很明顯的:很難做到全站的CSS切換,只能局限在當前頁上。為了記憶用戶的選擇,可行的方案就 是采用cookie。可是就算使用cookie,也需要在何時載入CSS,用戶沒有Javasciprt支持怎么辦等問題上多做好些文章。所以不如用下面 的方法——
方法三:服務器端腳本
毫無疑問,最好的CSS切換器應該使用服務器端腳本(PHP、ASP、JSP等)來開發。這樣做的好處是很明顯的:直接、高效、兼容性好、可以記憶用戶選擇、甚至可以組合不同的CSS實現相當復雜的“皮膚”切換。
我這里就用PHP為例,用其他的語言也都大同小異,對一般的開發人員來說不會有任何困難。
基本思路是這樣:用戶選擇一種“皮膚”,把用戶的選擇記入cookie(記入數據庫也一樣,不過這樣系統開銷會大一些),用戶訪問網站上的任何一個頁面時,再從cookie(或數據庫)中讀出之前用戶的選擇,載入相應的CSS文件(這里還是以方法一中講到的a.css和b.css為例)。
創建一個名為switcher.php的文件,內容如下:
;header("location:".$_SERVER[''HTTP_REFERER'']);?> 這段腳本先讀取query數據,然后把參數style的值記入cookie,最后返回上一頁。接下來我們就可以創建兩個用于切換樣式的鏈接了,并且放在合適的頁面上,比如首頁或用戶管理后臺(注意把其中的site.com換成你的域名): 主題A 主題B 點擊任意一個鏈接,相應的就會把“a”或“b”記入cookie,然后就需要一段腳本來讀取這個cookie值并且輸出XHTML來引入對應的CSS: title="當前選擇的主題" href=".css" /> 每一個需要切換樣式的頁面都要加上這段代碼,所以直接把它加入網站的頭文件中就行了。當然你可以根據自己的需要修改這個腳本,但萬變不離其宗,總的思路應該是不變的。 聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com