透過「CSS 總覽」面板進一步瞭解網頁的 CSS,並找出可能的改善項目。
開啟「CSS 總覽」面板
執行並重新執行 CSS 總覽報表
按一下「擷取總覽」按鈕,產生網頁的 CSS 總覽報表。
如要重新執行 CSS 總覽,請按一下「清除總覽」圖示 ,然後重複第一個步驟。
瞭解 CSS 總覽報表
報告由五個部分組成:
- 總覽摘要。您網頁的 CSS 概要摘要。
顏色。網頁上的所有顏色。顏色會按照類型分組,例如背景顏色、文字顏色等。這個部分也會顯示對比度低的文字。
每種顏色都可以點選。舉例來說,假設
#DADCE0
邊框顏色與網站的色彩配置不符。如要取得使用這個顏色的元素清單,請按一下該顏色。如要醒目顯示網頁上的元素,請將滑鼠遊標懸停在清單中的元素上。
如要在「元素」面板中開啟元素,請按一下清單中的元素。
字型資訊。網頁上的所有字型及其出現頻率,以不同的字型大小、字型粗細和行高分組。(與「顏色」部分類似,如要查看受影響的元素清單,請按一下元素出現點)。
未使用的宣告。所有沒有效果的樣式,依原因分組。
舉例來說,上述兩個宣告皆未使用,因為內容會決定內嵌元素的高度和寬度。如要查看對應的元素,請按一下發生的情況。
媒體查詢。您網頁上定義的所有媒體查詢,依出現次數遞減排序。如要查看受影響的元素清單,請按一下元素出現次數。