共用方式為


字型、新樣式和修改樣式對話方塊

[新樣式] 對話方塊的 [字型] 類別可讓您定義文字字型的階層式樣式表 (CSS) 樣式規則。 您可以將這些樣式規則直接套用至 HTML 項目,或加入至目前頁面或外部樣式表。

若要在目前頁面上定義 UI 項目的 CSS 字型樣式規則

  1. 在 [設計] 或 [來源] 檢視中開啟頁面。

  2. 或者,選取要對其套用樣式的文字及/或 HTML 項目。

  3. 按一下 [格式] 功能表上的 [新樣式]。

    [新樣式] 對話方塊隨即出現。

  4. 選取 [類別] 窗格中的 [字型]。

    字型樣式選取範圍會顯示在右窗格中。

當您將樣式套用至 [設計] 檢視中的文字時,樣式屬性會以內嵌方式插入頁面的 HTML 標記。 切換至 [原始碼] 檢視以檢閱新的樣式屬性。

若要將字型屬性加入在外部樣式表中定義的 CSS 樣式規則中

  1. 開啟現有外部樣式表。

  2. 將游標放置在要修改的樣式規則括號中。

  3. 執行下列其中一項。

    • 樣式表,在 [編輯器] 中,以滑鼠右鍵按一下,然後從快顯功能表中,選擇 建置樣式

    • 在 [樣式表] 工具列中,選擇建置樣式

    [修改樣式] 對話方塊隨即出現。

  4. 在左窗格中,按一下 [字型]。

    字型樣式選取範圍會顯示在右窗格中。

您可以將 CSS 樣式類別套用至 Web 網頁面中的項目,或將 body 項目的 class 屬性設定為類別選取器的名稱以套用至項目。

下表將列出在 [新樣式] 和 [修改樣式] 對話方塊之 [字型] 類別底下顯示的選項。

字型選項

  • font-family
    文字字型的名稱。 包含空格的字型名稱必須放在引號中,例如 "Times New Roman"。 您可以指定多個字型名稱,並以逗號 (,) 加以分隔。 清單中的最後一個字型最好是一般字型,例如 "serif"、"sans-serif",或 "monospace"。

  • font-size
    字型大小。 如果您輸入一個值,則可以在清單中選取值的單位。 建議您最好使用相對大小,例如 "small"、"x-large" 或百分比,如此一來使用者就可以透過 Web 瀏覽器來調整字型大小。

  • font-weight
    字型粗細,例如「標準」、「粗體」或 "400"。 數值表示從 100 的相對比重權值為 900。

  • font-style
    字型的樣式或坡度,例如「標準」或「斜體」。 如果您選取 "oblique",大部分的 Web 瀏覽器會以斜體方式呈現字型。

  • font-variant
    用於呈現字型的變型樣式。 值如下:

    • normal:將以標準樣式來呈現字型。

    • small-caps:將以小寫字母來呈現字型。

    • inherit:將從父項目繼承變型樣式。

  • text-transform
    用於定義文字大寫化效果的值。 值如下:

    • capitalize:將每個字的第一個字母變成大寫。

    • lowercase:所有字母都變成小寫。

    • uppercase:所有字母都變成大寫。

    • none:不變更文字大小寫樣式。

    • inherit:將從父項目繼承文字轉換樣式。

  • color
    文字字型的色彩。 若要可從中選擇其他色彩],使用向下箭號,或者按一下右邊的方塊圖示。 如需詳細資訊,請參閱 其他色彩和色彩對話方塊

  • text-decoration
    包含下列文字屬性的組合:[underline]、[overline]、[line-through] 和 [blink]。 如果您選取 [none],則其他所有核取方塊都會被清除。

其他 UI 項目

  • Selector
    (僅限 [新樣式] 對話方塊) 可讓您輸入類別名稱,或按一下 HTML 項目以套用樣式。 類別名稱必須以句號 (.) 開頭。 您也可以選取 [(內嵌樣式)],如此會將樣式套用至選取的文字或 HTML 項目。

  • 定義於
    (僅限 [新樣式] 對話方塊) 可讓您指定在何處寫入樣式規則的定義。 值如下:

    • 目前的頁面:將樣式規則寫入至目前頁面中的 style 項目。

    • 新樣式表 將新的 CSS 樣式表加入至專案,並且將規則寫入至該樣式表。

    • 現有的樣式表 將樣式規則加入至您使用 [URL] 清單所指定的 CSS 樣式表中。

  • URL
    (僅限 [新樣式] 對話方塊) 可讓您選取現有的 CSS 樣式表。 唯有當 [定義於] 設定為 [現有的樣式表] 時,才會啟用這個選項。

  • 套用新樣式到文件選取範圍
    (僅限 [新樣式] 對話方塊) 指定樣式套用至選取的文字、類別或 HTML 項目。

  • 預覽
    顯示範例,說明套用樣式規則時呈現的樣子。

  • 描述
    顯示樣式規則的 CSS 定義。

請參閱

參考

區塊、新樣式和修改樣式對話方塊

概念

使用 CSS 概觀

其他資源

色彩選擇器對話方塊

字型選擇器對話方塊