共用方式為


色彩選擇器對話方塊

更新:2007 年 11 月

用來指定樣式屬性到 HTML 元件。

若要存取本對話方塊

  1. 在 Microsoft Visual Web Developer 的 [設計] 檢視中,選取呈現標記的控制項或 HTML 項目 (例如 Table 控制項或 HTML <input> 按鈕)。

  2. 執行下列其中一個動作,以開啟 [樣式產生器] 對話方塊:

    • 在 [設計] 檢視中,取控制項或項目,然後依序按一下[格式] 和 [樣式]。

    • 在 [設計] 檢視中,以滑鼠右鍵按一下控制項或項目,然後按 [樣式]。

    • 選取這個控制項或項目,並在 [屬性] 視窗中選取它的 [樣式] 屬性,然後選擇省略按鈕 (...)。

    • 如果您是在 [文件樣式] 視窗中工作,請選取 [項目]、[類別] 或 [項目 ID],然後選擇 [建置樣式] 圖示。

    • 如果您正在編輯階層式樣式表 (CSS),請將插入點置於 CSS 樣式的大括號之間 ({ }),然後在 [樣式] 功能表上選擇 [建置樣式]。

    [樣式產生器] 對話方塊隨即開啟。

  3. 在 [色彩] 下拉式清單所在的 [樣式產生器] 對話方塊中選取任一個索引標籤,然後按一下方塊旁的省略按鈕 (...)。

    [色彩選擇器] 對話方塊隨即開啟。

工作

UI 項目

  • Web 調色盤
    當您在這個索引標籤上選取某個色樣 (Color Swatch) 時,它的十六進位 RGB 碼會出現在 [色彩] 欄位中,而且當關閉 [樣式產生器] 對話方塊時,選取的 attribute:RGBcolor 配對就會插入到 CSS 樣式定義中。

    例如,在 [設計] 檢視中編輯 HTML 網頁時,請在 [文件大綱] 視窗中選取 <BODY> 項目,然後在 [格式] 功能表上選擇 [建置樣式]。選取 [背景] 並選擇 [色彩] 欄位旁的省略符號按鈕 (...),開啟 [色彩選擇器] 對話方塊。在它的 [Web 調色盤] 索引標籤上,選擇淺藍色彩樣本,然後按一下 [確定]。當您關閉 [樣式產生器] 對話方塊時,類似下面的 attribute:RGBcolor 配對就會插入到 BODY 樣式的大括號 ({ }) 之間:

    BODY { BACKGROUND-COLOR: #99ffff; } 
    

    如需詳細資訊,請參閱 色彩選擇器對話方塊、Web 調色盤索引標籤

  • 命名色彩
    當您在這個索引標籤上選取某個色樣時,它的色彩名稱和十六進位 RGB 碼就會出現在 [色彩] 欄位中。當選取某個 [基本] 或 [其他] 命名色彩時,attribute:colorname 配對就會插入到 CSS 樣式定義中。

    例如,在 [設計] 檢視中編輯 HTML 網頁時,請在 [文件大綱] 視窗中選取 <BODY> 項目,然後從 [格式] 功能表選擇 [建置樣式]。選取 [背景] 並選擇 [色彩] 欄位旁的省略符號按鈕 (...),開啟 [色彩選擇器] 對話方塊。在 [命名色彩] 索引標籤上,從底端列選取 [淺藍] (#add8e6) 色彩。當您關閉 [樣式產生器] 對話方塊時,下列的 attribute:colorname 配對就會插入到 BODY 樣式的大括號 ({ }) 之間:

    BODY { BACKGROUND-COLOR: lightblue; } 
    

    如需詳細資訊,請參閱色彩選擇器對話方塊、命名色彩索引標籤

  • 系統色彩
    當您選取某個色彩時,系統色彩分類就會出現在 [色彩] 欄位中,而且當關閉 [樣式產生器] 對話方塊時,attribute:category 配對就會插入到 CSS 樣式定義中。

    例如,在編輯 CSS 樣式表時,請將游標置於 <BODY> 項目之 CSS 樣式的大括號 ({ }) 之間,然後從 [格式] 功能表選擇 [建置樣式]。選取 [背景] 並選擇 [色彩] 欄位旁的省略符號按鈕 (...),開啟 [色彩選擇器] 對話方塊。在它的 [系統色彩] 索引標籤上,選取 [背景] 色彩分類,然後選擇 [確定]。當您關閉 [樣式產生器] 對話方塊時,下列 attribute:colorname 配對就會插入到 BODY 樣式中:

    BODY { BACKGROUND-COLOR: background; } 
    
    注意事項:

    使用系統色彩時,並不是指定要顯示的色彩。系統不同,背景色彩也不相同,視使用者選取的桌面色彩而定。一般而言,只有針對共用通用和可預期 [顯示] 設定之使用者群組所設計的 Web 專案,才應該使用 [系統色彩] 分類。

    如需詳細資訊,請參閱色彩選擇器對話方塊、系統色彩索引標籤

  • 自訂色彩
    若要建立自訂色彩,請拖曳紅、綠、藍三種主要色彩的滑桿,直到 [預覽] 欄位中出現您想要的色調為止。當您關閉 [樣式產生器] 對話方塊時,顯示在 [色彩] 欄位中的 RGB 色彩碼就會插入到 CSS 樣式定義中。顯示在每個滑桿右邊的十進位值範圍在 0 (無色彩) 到 255 (最大色彩) 之間。每個滑桿的預設值為 255。

    注意事項:

    自訂色彩是使用您監視器目前的 [顯示] 設定顯示的。它在其他使用者的監視器和 Web 瀏覽器上看起來可能會不一樣。當 Web 專案是設計用來讓共用通用且可預期之顯示設定的一群使用者使用時,自訂色彩便適合保留給這些專案使用。

    例如,在編輯 CSS 樣式表時,請將游標置於 INPUT.button 樣式之 CSS 樣式的大括號 ({ }) 之間,接著在 [建置樣式] 對話方塊中選取 [背景],然後選擇 [色彩] 欄位旁邊的省略按鈕 (...),開啟 [色彩選擇器] 對話方塊。在它的 [自訂色彩 索引標籤上,讓 [紅色] 和 [綠色] 滑桿保持其預設值 255,並將 [藍色] 滑桿向左拖曳至 102。當您關閉 [樣式產生器] 對話方塊時,下列 attribute:RGBcolor 配對就會插入到樣式的大括號 ({ }) 之間:

    INPUT.button { background-color: #ffff66; } 
    

    如需詳細資訊,請參閱色彩選擇器對話方塊、自訂色彩索引標籤

  • 色彩
    顯示所選色彩的十六進位 RGB 碼。

  • 確定
    關閉 [色彩選擇器] 對話方塊,並將選取的 attribute:color 配對加入至 CSS 標記,以便在關閉 [樣式產生器] 對話方塊時插入該標記。

請參閱

概念

ASP.NET Web 伺服器控制項和 CSS 樣式

參考

色彩選擇器對話方塊、Web 調色盤索引標籤

色彩選擇器對話方塊、命名色彩索引標籤

色彩選擇器對話方塊、系統色彩索引標籤

色彩選擇器對話方塊、自訂色彩索引標籤