Диалоговое окно "Палитра цветов"

  • Статья

Обновлен: Ноябрь 2007

Используется для присвоения атрибутов стиля элементам HTML.

Вызов диалогового окна

  1. В Microsoft Visual Web Developer в режиме конструктора выберите элемент управления или элемент HTML, отображающий разметку (например, элемент управления Table или HTML-кнопку <input>).

  2. Откройте диалоговое окно Построитель стилей, выполнив одно из следующих действий:

    • В режиме Конструктора выберите элемент управления или другой элемент, нажмите Формат, а затем Стиль.

    • В режиме Конструктора щелкните правой кнопкой мыши элемент управления или другой элемент и выберите Стиль.

    • Выберите элемент управления или другой элемент, выделите свойство Стиль в окне "Свойства" и нажмите кнопку с многоточием (...).

    • Если вы работаете в окне "Стили документа", выберите Элемент, Класс или Идентификатор элемента, а затем нажмите значок Построить стиль.

    • Если редактируется таблица каскадных стилей CSS, поместите курсор между фигурными скобками ( "{ }" ) стиля CSS и выберите команду Построить стиль в меню Стиль.

    Появится диалоговое окно Построитель стилей.

  3. Выберите любую из вкладок в диалоговом окне Построитель стилей, в которой есть раскрывающийся список Цвет, и нажмите кнопку с многоточием (…) рядом с ним.

    Появится диалоговое окно Палитра цветов.

Задачи

Элементы пользовательского интерфейса

  • Веб-палитра
    При выборе образца цвета на этой вкладке в поле "Цвет" появляется его шестнадцатеричный RGB-код, а выбранная пара attribute:RGBcolor будет вставлена в определение стиля CSS после закрытия диалогового окна Построитель стилей.

    Например, при редактировании HTML-страницы в режиме Конструктора выберите элемент <BODY> в окне "Структура документа", а затем в меню Формат выберите команду Построить стиль. Выберите Фон и нажмите кнопку с многоточием (...) рядом с полем Цвета, чтобы открыть диалоговое окно Палитра цветов. На вкладке Веб-палитра выберите светло-голубую цветовую палитру и нажмите кнопку ОК. После закрытия диалогового окна Построитель стилей между фигурными скобками ("{ }") стиля BODY будет вставлена пара attribute:RGBcolor, аналогичная следующей:

    BODY { BACKGROUND-COLOR: #99ffff; }

    Дополнительные сведения см. в разделе Вкладка "Веб-палитра" диалогового окна "Палитра цветов".

  • Именованные цвета
    При выборе образца цвета на этой вкладке в поле Цвет будут отображено имя цвета и его шестнадцатеричный RGB-код. При выборе Стандартных или Дополнительных именованных цветов пара attribute:colorname вставляется в определение стиля CSS.

    Например, при редактировании страницы HTML в режиме конструктора выберите элемент <BODY> в окне "Структура документа", после чего выберите в меню Формат команду Построить стиль. Выберите Фон и нажмите кнопку с многоточием (...) рядом с полем Цвета, чтобы открыть диалоговое окно Палитра цветов. На вкладке Именованные цвета выберите в нижней строке цвет LightBlue (#add8e6). После закрытия диалогового окна Построитель стилей между фигурными скобками ("{ }") стиля BODY будет вставлена следующая пара attribute:colorname:

    BODY { BACKGROUND-COLOR: lightblue; }

    Дополнительные сведения см. в разделе Диалоговое окно "Палитра цветов", вкладка "Именованные цвета".

  • Системные цвета
    При выборе образца цвета на этой вкладке в поле Цвет появляется категория системного цвета, а выбранная пара attribute:category будет вставлена в определение стиля CSS после закрытия диалогового окна Построитель стилей.

    Например, если редактируется таблица стилей CSS, поместите курсор между фигурными скобками ("{ }") стиля CSS для элемента <BODY> и выберите в меню Формат команду Построить стиль. Выберите Фон и нажмите кнопку с многоточием (...) рядом с полем Цвета, чтобы открыть диалоговое окно Палитра цветов. На вкладке Системные цвета выберите категорию цвета Фон и нажмите кнопку "ОК". После закрытия окна диалогового окна Построитель стилей в стиль BODY будет вставлена следующая пара attribute:colorname:

    BODY { BACKGROUND-COLOR: background; }
    50yk586z.alert_note(ru-ru,VS.90).gifПримечание.

    При выборе системного цвета отображаемый цвет не указывается. Цвет фона в разных системах будет различаться в зависимости от выбранного цвета рабочего стола. Обычно категории системных цветов следует применять только в веб-проектах, разрабатываемых для групп пользователей, применяющих общие и предсказуемые параметры отображения.

    Дополнительные сведения см. в разделе Вкладка "Системные цвета" диалогового окна "Палитра цветов".

  • Настраиваемые цвета
    Чтобы создать настраиваемый цвет, переместите ползунки для основных цветов (красного, зеленого и синего) в такие положения, при которых в поле Образец отобразится нужный оттенок. Его RGB-код, отображаемый в поле Цвет, будет вставлен в определение стиля CSS после закрытия диалогового окна Построитель стилей. Справа от каждого ползунка отображаются десятичные значения в диапазоне от 0 (нет цвета) до 255 (максимальный цвет); значение по умолчанию для каждого цвета равно 255.

    50yk586z.alert_note(ru-ru,VS.90).gifПримечание.

    Настраиваемый цвет отображается в соответствии с текущими параметрами отображения. На мониторе другого пользователя или при использовании другого веб-обозревателя он может выглядеть иначе. Настраиваемые цвета имеет смысл использовать в веб-проектах, разрабатываемых для групп пользователей, применяющих общие и предсказуемые параметры отображения.

    Например при редактировании таблицы стилей CSS поместите курсор между фигурными скобками ({ }) стиля CSS для класса стиля INPUT.button, выберите Фон в диалоговом окне Построить стиль и нажмите кнопку с многоточием (...), расположенную рядом с полем Цвет, чтобы открыть диалоговое окно Палитра цветов. На вкладке Другой цвет оставьте положения ползунков Красный и Зеленый установленными на значения по умолчанию 255, а ползунок Синий переместите влево до значения 102. После того как диалоговое окно Построитель стилей закроется, между фигурных скобок ("{ }") в определении стиля будет вставлена следующая пара значений attribute:RGBcolor:

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

    Дополнительные сведения см. в разделе Вкладка "Другой цвет" диалогового окна "Палитра цветов".

  • Цвет
    Отображается шестнадцатеричное значение RGB-кода выбранного цвета.

  • ОК
    Закрывает диалоговое окно Палитра цветов и добавляет выбранную пару attribute:color в разметку CSS, которая будет вставлена при закрытии диалогового окна Построитель стилей.

См. также

Основные понятия

Серверные веб-элементы управления ASP.NET и стили CSS

Ссылки

Вкладка "Веб-палитра" диалогового окна "Палитра цветов"

Диалоговое окно "Палитра цветов", вкладка "Именованные цвета"

Вкладка "Системные цвета" диалогового окна "Палитра цветов"

Вкладка "Другой цвет" диалогового окна "Палитра цветов"