定義及套用類別和 ID 樣式

如果您要將相同樣式指定給多個元素,請使用 classes。您可以利用類別,將類別關聯於標示,使不同的標示有相同的樣式。

必備條件建立樣式表

您可以將多個類別關聯到每次出現的相同標示上,使相同標示能有不同的樣式。

如果要建立和套用類別樣式,請執行下列動作:

  1. 開啟您要編輯的 .css 檔, 方法為在「專案瀏覽器」視圖中按兩下該檔案。 這時編輯區中會開啟該樣式表。
  2. 如果要建立類別樣式,請執行下列動作:
    1. 按一下新增樣式規則 「新增樣式規則」圖示圖示。 這時會開啟「設定新樣式的選取器」對話框。
    1. 選取類別圓鈕。請在類別名稱欄位中,提供類別的名稱。這個名稱的開頭必須是句點, 例如 .note ID 選項的作用與類別選項幾乎完全相同。唯一不同是您只能將 ID 套用至頁面中的一個位置(標示的單次出現)。 因此,建議您使用類別,不要用 ID。 如果您要使用 ID,請選取 ID 圓鈕, 然後在 ID 欄位中輸入名稱。這個名稱的開頭必須是 #。
    2. 按一下確定
    3. 利用「新增樣式」對話框來新增特定樣式定義。
    4. 按一下確定,儲存您的變更。您指定的類別名稱會顯示在「樣式」視圖中。
  3. 如果要將類別套用至元素,請執行下列動作:
    1. 在 Page Designer 的「設計」頁面中選取元素。
    2. 在「內容」視圖中, 按一下「類別」欄位旁的「瀏覽」圖示。「內容」視圖中的「類別」欄位圖這時會開啟「選取類別」對話框。
    3. 展開樣式表,然後選取所要的類別。

      「選取類別」對話框中的所選類別圖

    1. 按一下確定
  4. 如果要套用 ID 樣式,請執行下列動作:
    1. 選取要將 ID 樣式套用到的元素。
    2. 在「內容」視圖中,按一下所有屬性 「所有屬性」圖示圖示。
    3. 在 ID 欄位中,輸入 ID 名稱(不含 #)。

      「內容」視圖中的 ID 屬性圖

  5. 依照相同的方式,您可以選取其他元素,再套用相同的類別樣式。 您也可以從「樣式」工具列套用已定義的類別樣式。從 Page Designer 中,選取工具列 > 樣式來顯示「樣式」工具列。您可以從下拉清單選取類別名稱, 將類別樣式套用至焦點元素。
  6. 如果要查看樣式表所用的類別定義,請按一下「樣式」視圖中的樣式。這時您可在「內容」視圖中看到樣式定義。
相關概念
階式樣式表 (CSS) 設計程式
相關工作
定義樣式
指定預先定義之區域的樣式
移除指定的樣式
定義元素的樣式
定義虛擬 HTML 鏈結樣式
使用條款 | 讀者意見
(C) Copyright IBM Corporation 2000, 2005. All Rights Reserved.