管理樣式工作窗格

發行項
10/11/2017

[管理樣式] 工作窗格可讓您套用、修改、重新命名及刪除樣式；附加或卸離外部階層式樣式表 (CSS)；選取樣式的所有例項；移至含有樣式規則集的程式碼。您也可以使用 [管理樣式] 工作窗格，將外部 CSS 中的樣式移至內部 CSS 中 (或執行相反的作業)，或移動 CSS 之中某樣式的位置。

當您開啟網頁時，[管理樣式] 工作窗格會列出網頁的外部與內部階層式樣式表 (CSS) 中所定義的所有樣式，但不會列出內嵌 CSS 所定義者。您可以將工作窗格設定為列出所有樣式，或將其限定為僅列出目前的網頁或網頁中目前選取範圍所使用的樣式。所有類別、元素與識別碼選取器都會出現在含有該樣式之外部 .css 檔案的名稱下；若該樣式位於內部 CSS 中，則會出現在 [本頁] 中。

秘訣：
若要使用指標在浮動視窗中暫時顯示某個樣式的所有屬性宣告，請在 [管理樣式] 工作窗格中指向該樣式。

管理樣式工作窗格

Cc295470.43e2a2bf-87b3-49a4-ac55-1211d2fbb028(zh-tw,Expression.10).bmp

[本頁] 可列出內部 CSS 與匯入的外部 CSS 檔案之類別、元素與識別碼選取器。
匯入目前網頁的外部 CSS 檔案。
目前網頁內部 CSS 中所定義的樣式。
連結自目前網頁的外部 CSS 檔案。
根據預設，含有多個選取器的樣式選取器會以群組的方式顯示。只要按一下 [選項]，再按 [分隔群組選取器]，即可將選取器個別列出。

在 [管理樣式] 工作窗格中每個樣式旁所顯示的圖示，可識別樣式的類型以及樣式是否用於目前的網頁中。

管理樣式工作窗格圖示

圖示	描述
	識別碼選取器旁會出現紅點。
	類別選取器旁會出現綠點。
	元素選取器旁會出現藍點。
	目前的網頁中所使用的樣式會以圈起來的彩色點標示。
	匯入的外部階層式樣式表旁會出現 @ 符號。

移動樣式

在 [管理樣式] 工作窗格中按一下 [選項]，然後選取 [依順序分類]。

請執行下列任何動作：

若要移動 CSS 中的樣式位置，請在清單中將樣式向上或向下拖曳。例如，您可以將最常用的樣式移至同一處，以便集中顯示。
若要將內部 CSS 中的樣式移至附加於網頁的外部 CSS 中，請將樣式從 [本頁] 拖曳至要用以存放該樣式之外部 CSS 的名稱下，或拖曳至外部 CSS 之樣式清單中的特定點上。
若要將外部 CSS 中的樣式移至內部 CSS 中，請將樣式從外部 CSS 的名稱下拖曳至 [本頁] 中，或拖曳至 [本頁] 下之樣式清單中的特定點上。若未顯示 [本頁]，請在網頁的 <head></head> 標籤之間加入一組 <style></style> 標籤。
若要將外部 CSS 中的樣式移至另一個外部 CSS 中，請將樣式拖曳至要用以存放該樣式之外部 CSS 的名稱下，或移至外部 CSS 之樣式清單中的特定點上。

注意事項：
若您將 [管理樣式] 工作窗格在 [選項] 工作窗格中設定為 [依元素分類] 或 [依類型分類]，即無法將樣式移至樣式清單中的特定點上。無論使用上述哪個選項，都只能將樣式拖曳至外部 CSS 檔案的名稱下或 [本頁] 中 (針對內部 CSS)，藉以將外部 CSS 中的樣式移至另一個外部 CSS 或內部 CSS 中，或執行相反的作業。

若您將 [管理樣式] 工作窗格在 [選項] 工作窗格中設定為 [依元素分類] 或 [依類型分類]，即無法將樣式移至樣式清單中的特定點上。無論使用上述哪個選項，都只能將樣式拖曳至外部 CSS 檔案的名稱下或 [本頁] 中 (針對內部 CSS)，藉以將外部 CSS 中的樣式移至另一個外部 CSS 或內部 CSS 中，或執行相反的作業。

排序管理樣式工作窗格中的樣式

在 [管理樣式] 工作窗格中按一下 [選項]，然後執行下列動作：

選取此項	執行此作業
依順序分類	根據樣式在 CSS 中的顯示順序加以列示。
依元素分類	在套用各項樣式的 HTML 元素下列示樣式。
依類型分類	根據字母順序與樣式的類型列示樣式。

個別列示含有多個選取器的各個樣式選取器

在 [管理樣式] 工作窗格中按一下 [選項]，然後選取 [分隔群組選取器]。

顯示或隱藏管理樣式工作窗格中的樣式

在 [管理樣式] 工作窗格中按一下 [選項]，然後執行下列動作：

選取此項	執行此作業
顯示所有樣式	列示目前網頁的外部、內部與內嵌 CSS 中所含的所有樣式。
顯示目前網頁使用的樣式	僅列示目前的網頁中所使用的樣式。
顯示選取範圍使用的樣式	僅列示網頁中目前的選取範圍所使用的樣式。