Windows XP Windows 7 Windows 2003 Windows Vista Windows教程綜合 Linux 系統教程
Windows 10 Windows 8 Windows 2008 Windows NT Windows Server 電腦軟件教程
 Windows教程網 >> 電腦軟件教程 >> 關於電腦軟件教程 >> 如何用CSS巧改網頁

如何用CSS巧改網頁

日期:2017/2/10 15:27:04      編輯:關於電腦軟件教程
每個網站都有自己的風格,如果你喜歡某個網站的內容,卻不喜歡這個網站的網頁風格,怎麼辦?下面系統之家告訴你如何通過CSS樣式文件對網頁進行修改,讓網站變成自己想要的樣子。

為浏覽器添加CSS管理

要想更好地使用和管理CSS,無論是谷歌還是火狐浏覽器,都需要安裝一個名為Stylish的擴展。這裡以火狐浏覽器為例,首先點擊“工具”菜單中的“附加組件”命令,在彈出的窗口選擇左側列表中“獲取附加組件”項,再在窗口的左上角輸入關鍵詞“Stylish”搜索,搜索到後點擊該擴展名稱後的“安裝”。安裝完畢,點擊“立即重啟”完成浏覽器對該擴展的確認。

實戰1:啟用夜間模式浏覽

每天對著電腦工作時間一長,就會覺得眼睛發干和難受。其實我們可以通過CSS樣式文件,對網頁的內容進行調節,改變網頁背景過亮的情況。

首先登錄http://userstyles.org,在窗口左側輸入關鍵詞Global dark style,在搜索結果裡面可以看到大量的夜間模式樣式。從中選擇一個自己喜歡的樣式並打開鏈接,接著在彈出的網頁中點擊Install with Stylish按鈕。然後在彈出的“安裝用戶樣式”窗口點擊“安裝”,完成這個CSS樣式文件的安裝(圖1)。

如何把網頁改成自己喜歡的樣子,CSS改網頁教程,系統之家

最後重新刷新一下當前頁面,就可以啟用夜間模式的效果了。夜間模式通常會用深色為底色,用其他顏色反襯出網頁的內容,從而避免網頁背景過亮對眼睛的刺激(圖2)。

如何把網頁改成自己喜歡的樣子,CSS改網頁教程,系統之家

實戰2:百度谷歌雙列顯示結果

當然,並不是所有需要的CSS樣式文件都可以在userstyles.org網站找到,因此有的時候我們需要手動添加。我們可以自己編寫,也可以從論壇或者貼吧中找到想要的CSS樣式文件。

現在無論是台式機還是筆記本電腦,使用的基本上都是寬屏顯示器,這樣在使用百度搜索時,單列顯示結果會“浪費”大量的屏幕資源,於是我找到一個可以將百度搜索結果顯示為雙列的CSS樣式文件(下載地址:http://tinyurl.com/k24krvx)。

繼續上個實戰,點擊浏覽器“工具”菜單中的“附加組件”,在彈出的窗口中,選擇左側列表中“用戶樣式”項。點擊窗口裡面的“編寫新樣式”按鈕,在彈出的對話框中分別設置CSS樣式的“名稱”和“標簽”。接著將下載的CSS樣式文件,用一個文本編輯器進行打開,將其中的所有代碼粘貼到CSS樣式編輯框裡面(圖3)。設置完畢點擊“保存”按鈕,手工添加CSS樣式文件的工作也就完成了。

如何把網頁改成自己喜歡的樣子,CSS改網頁教程,系統之家

以後當我們用百度(或谷歌)搜索時,搜索結果會以兩列的形式顯示,比平常多顯示出雙倍的結果,而且以前顯示在旁邊的廣告信息也被成功過濾了,顯得更加簡潔實用(圖4)。

如何把網頁改成自己喜歡的樣子,CSS改網頁教程,系統之家

本文來自於【系統之家】 www.xp85.com

Copyright © Windows教程網 All Rights Reserved