很多網(wǎng)站會不定期地進行一些改版操作,但是這樣的修改往往會使得一些人不適應(yīng)。除此以外,不少網(wǎng)頁里面會有很多的廣告信息,這樣也會使得網(wǎng)頁閱讀起來不太方便。其實這一切都可以通過CSS對網(wǎng)站代碼進行修改,最終使網(wǎng)站可以達到自己認可的閱讀習(xí)慣。
簡約時尚的微博界面
要想很好地使用CSS來改變網(wǎng)頁的樣式,首先需要為瀏覽器安裝一個功能擴展。比如我使用的是谷歌瀏覽器,于是進入到谷歌應(yīng)用商場,搜索一款名為Stylish的擴展。搜索出來的結(jié)果有很多,在結(jié)果中點擊“擴展程序”這項,然后找到Stylish擴展進行安裝就可以了。安裝完成以后可以在地址欄旁邊看到一個S圖形的圖標,在圖標上點擊鼠標右鍵,選擇菜單中的“Stylish”命令,瀏覽器就會自動連接到一個專業(yè)的CSS網(wǎng)站。這里面有很多的CSS代碼,可以供用戶進行選擇和使用。
比如我們想改變新浪微博的頁面樣式,讓它變得更加簡潔大方,同時又可以去除周邊眾多的廣告。首先就在網(wǎng)頁左上角的搜索框中輸入“weibo”,按下回車鍵以后就可以看到很多相關(guān)的CSS樣式(如圖1)。從中選擇一個自己比較滿意的CSS樣式,點擊樣式的名稱后在彈出的頁面中點擊“install with Stylish”按鈕(如圖2)。這時會彈出一個安裝CSS樣式的詢問對話框,點擊對話框中的“確定”按鈕,就可以安裝到Stylish擴展里面。以后當我們重新進入新浪微博的時候,會發(fā)現(xiàn)新浪微博的頁面有一種煥然一新的感覺(如圖3)。
雙列顯示的谷歌搜索
有的時候并不是所有需要的CSS代碼都可以在專業(yè)的網(wǎng)站里面找得到,或者說我們通過其他方式得到了相應(yīng)的CSS代碼的話,那么如何將其添加到擴展里面呢?首先點擊谷歌瀏覽器右上角的自定義按鈕,在彈出的菜單里面依次選擇“工具”菜單中的“擴展程序”命令。在彈出的網(wǎng)頁里面找到Stylish擴展的名稱,然后點擊擴展介紹下面的“選項”命令,在彈出的網(wǎng)頁窗口就可以對所有的CSS代碼進行管理。
由于現(xiàn)在的顯示器基本上都是寬屏,所以我們可以利用CSS代碼將搜索引擎的結(jié)果由一列顯示為雙列?,F(xiàn)在點擊左側(cè)列表中的“寫入新樣式”按鈕,在彈出的修改樣式對話框中,首先在“名稱”中為CSS代碼設(shè)定一個名稱,比如我們這里設(shè)置為“谷歌雙列”。接著勾選上“已啟用”選項,這樣這段代碼添加完成以后就可以馬上使用。接下來將獲得的CSS代碼粘貼到右側(cè)窗口里面的“代碼”輸入框中(如圖4)。
由于找到的CSS代碼只對指定的特定對象有用,于是在窗口下方找到“應(yīng)用對象”選項。首先在列表中選擇“該域上的網(wǎng)址”這項,接下來在后面的輸入框中輸入谷歌的網(wǎng)站,即www.google.com。設(shè)置完成以后點擊“添加”按鈕,接下來按照同樣的方式添加其他的谷歌域名,比如www.google.com.hk、www.google.com.tw等。所有的設(shè)置完成以后,點擊“保存”按鈕和“返回進行管理操作”按鈕,就能返回到Stylish擴展的主界面。以后再利用谷歌搜索引擎的時候,就會發(fā)現(xiàn)搜索結(jié)果用雙列進行顯示了(如圖5)。