設定程式碼格式

您可以設定可影響 Microsoft Expression Web 中程式碼外觀的選項,以及其他可重新設定程式碼格式的選項。

基本的分行符號、空白字元及縮排等設定格式技巧,可讓您更容易閱讀及編輯程式碼,卻不會影響網頁外觀。您可以在 Expression Web 中指定上述設定及其他設定,並為標籤、屬性、值和指令碼設定專用的字型色彩和大小。

Note注意:

開啟包含現有程式碼的網頁時,Expression Web 依預設會保留該網頁的程式碼格式設定。[網頁編輯器選項] 對話方塊之 [程式碼格式設定] 索引標籤上的設定,僅能套用到您建立的新網頁以及新增或編輯的內容。

設定程式碼檢視選項

  1. 按一下 [工具] 功能表上的 [網頁編輯器選項]。

  2. 在 [網頁編輯器選項] 對話方塊的 [一般] 索引標籤中,在 [程式碼檢視選項] 底下執行下列動作:

    使用此項 執行此作業

    自動換行

    各行程式碼皆依編輯視窗的目前寬度換行。

    自動縮排

    當您按下 ENTER 或 RETURN 而開始新行時,保留目前的縮排層級。

    行號

    在程式碼各行的左側顯示唯一的號碼。

    選取範圍邊界

    在編輯視窗的左側新增邊界,讓您按一下或拖曳即可選取一或多行的程式碼。

    標示無效的 HTML

    以特定色彩 (預設為紅色) 顯示無效的 HTML 並附背景色彩 (預設為黃色),這些設定可於 [網頁編輯器選項] 對話方塊的 [色彩編碼] 索引標籤中指定。

    tip note秘訣:
    若要顯示包含無效或不相容程式碼之特定例項詳細資訊的浮動視窗,請在 [程式碼] 檢視中指向反白顯示或加底線的程式碼。

    標示不相容的 HTML

    與 HTML 標準不相容的程式碼下會顯示波浪型底線。

    tip note秘訣:

    您亦可使用 [程式碼檢視] 工具列設定這些選項。如需詳細資訊,請參閱程式碼檢視工具列

設定程式碼格式

  1. 按一下 [工具] 功能表上的 [網頁編輯器選項]。

  2. 在 [網頁編輯器選項] 對話方塊的 [程式碼格式設定] 索引標籤上,執行下列動作:

    使用此項 執行此作業

    重設

    將各選項重設為預設值。

    標籤名稱為小寫

    請輸入小寫標籤,不要輸入大寫標籤。

    小寫屬性名稱

    請輸入小寫屬性名稱,不要輸入大寫屬性名稱。

    依字母順序排列的屬性名稱

    依字母排列順序輸入 HTML 屬性。

    允許標籤內分行

    標籤內允許分行,不必將標籤全數留在一行中。

    定位點大小

    設定在 [程式碼] 檢視中按下 TAB 以及由 [縮排] 程式碼格式設定選項使用時,所要縮排的字元空格數。

    縮排

    設定巢狀程式碼的左邊界大小及單位。

    右邊界

    設定程式碼的右邊界大小。

    插入定位點為空格

    將定位點格式設為空格。

    標籤

    若要設定格式化特定標籤的選項,請選取要設定格式的標籤,然後在 [分行符號] 的 [分行符號] 區段下,設定所要的選項。例如,若要省略一般出現在各個清單項目之後的清單項目結束標籤 (</li>),請於 [標籤] 下選取 li,再選取 [省略結束標籤]。

    CSS

    若要設定格式化特定 CSS 元件的選項,請選取要設定格式的元件,然後於 [設定格式] 下設定所要的選項。例如,若希望開始樣式宣告區塊的開頭大括號 ({) 後面出現特定的空格數,請於 CSS 下選取 [開頭括號],然後在 [後置空格] 方塊中指定所要的空格數。

    在新行上縮排屬性

    縮排 Expression Web 所寫的 CSS 屬性。

    產生樣式時使用省略屬性

    使用省略的 CSS 屬性,而不使用普通寫法。例如,選取此選項時,Expression Web 僅需在 [樣式] 中設定框線屬性,即可定義框線的寬度、色彩及樣式等值。清除此選項時,Expression Web 就只會設定各框線屬性的屬性及值。

    Note注意:

    您所指定的部份程式碼格式設定選項,會影響所有現有網頁,而有些選項則只會影響您後續建立的新網頁。若要重新設定現有網頁之程式碼的格式,請參閱「重新設定現有網頁之程式碼的格式」程序。

重新設定現有網頁之程式碼的格式

  1. 開啟要重新設定格式的網頁。

  2. 在 [程式碼] 窗格中以滑鼠右鍵按一下 [重新格式化 HTML],並加以選取。

根據特定網頁的程式碼格式設定,設定程式碼格式設定的選項

  1. 在要以其設定為基礎的網頁為開啟的情況下,按一下 [工具] 功能表上的 [網頁編輯器選項]。

  2. 在 [網頁編輯器選項] 對話方塊中,按一下 [程式碼格式設定] 索引標籤的 [以本頁為基準],再按 [確定]。

指定程式碼色彩

  1. 按一下 [工具] 功能表上的 [網頁編輯器選項]。

  2. 在 [網頁編輯器選項] 對話方塊的 [色彩編碼] 索引標籤上,執行下列動作:

    使用此項 執行此作業

    程式碼檢視設定

    切換到程式碼檢視設定。

    重設預設值

    將各選項設定為其預設值。

    顯示項目

    選取您要設定格式的項目。

    項目前景、項目背景與字型樣式

    為 [顯示項目] 下所選取的項目進行程式碼格式設定

指定程式碼字型

  1. 按一下 [工具] 功能表上的 [網頁編輯器選項]。

  2. 在 [網頁編輯器選項] 對話方塊的 [程式碼檢視] 之 [預設字型] 索引標籤上,設定 [字型] 及 [大小] 值。

縮排特定行的程式碼

  1. 在網頁的 [程式碼] 檢視中,將游標置於要縮排的該行程式碼中,或選取要縮排的程式碼。

  2. 在 [編輯] 功能表上,指向 [程式碼檢視],然後按一下 [增加縮排] 或 [減少縮排]。

另請參閱

工作

將暫時性書籤加入程式碼

參照

程式碼檢視工具列