CSS usage 是一款基於firebug的firefox 擴展,可以用來查看 頁面中的CSS 使用情況,從而方便開發 者優化CSS樣式表。
CSS Usage的下載地址
https://addons.mozilla.org/en-US/firefox/addon/10704
CSS Usage的使用用法
- 打開你想要掃描的網站的頁面,打開Firebug,切換到CSS Usage標籤,然後點擊”scan”按鈕。
- 如果是用了大量ajax 或者dhtml 的網站中,打開儘可能多的隱藏的 div/窗口/tab,以使CSS Usage爬取儘可能多的內容。
- 然後訪問你的網站的其它頁面。
- 每訪問一個新的頁面,請按一次”scan”按鈕。當然,也可以選擇autoScan按鈕,這樣就不用每次按Scan按鈕了。
掃描的結果中,綠色的規則表示當前頁面中有用到,黑色表示其它頁面中用到,紅色表示沒有被掃描到(至少在當前頁面),灰色是僞類(:hover之 類)
CSS Usage的一些特性 :
- 可顯示規則的行數
- 自動掃描(autoScan)
- 鏈接到CSS文件(可以在新tab中打開該CSS文件)