Цвет текста: свойство color Синтаксис: color: <цвет> | inherit Начально: зависит от обозревателя Применимо: ко всем элементам Наследуемо: да Проценты: не используются Устройства: визуальные Поддержка : Соответствует стандарту (4.0+) Соответствует стандарту (4.0+) Свойство color задает цвет текста содержимого элемента при отображении. Примеры: H1 { color: blue } H2 { color: #000080 } H3 { color: #0c0 } Примечание. Во избежании конфликта с пользовательской таблицей стилей, это свойство следует задавать вместе со свойством background. Задание фона Фон элемента может задаваться либо цветом (background-color), либо графическим образом (background-image, background-repeat, background-attachment и background-position). Можно также пользоваться сокращенным свойством background. Напомним, что фон элемента распространяется на область содержимого элемента и его заполнителя. Фон корня дерева документов является фоном для отображения документа в целом, но для HTML-документов рекомендуется задавать общий фон в свойствах элемента BODY, а не HTML. Цвет фона: свойство background-color Синтаксис: background-color: <цвет> | transparent | inherit Начально: transparent Применимо: ко всем элементам Наследуемо: нет Проценты: не используются Устройства: визуальные Поддержка : Соответствует стандарту (4.0+) Соответствует стандарту (4.0+) Свойство background-color задает цвет фона элемента при отображении. Значение transparent, принятое по умолчанию, соответствует прозрачному фону. Примеры: BODY { background-color: white } H1 { background-color: #0000F0 } H2 { background-color: #0cc } Примечание. Во избежании конфликта с пользовательской таблицей стилей, при задании этого свойства следует задавать также свойство background-image (обычно со значением none). Графический образ фона: свойство background-image Синтаксис: background-image: <uri> | none | inherit Начально: none Применимо: ко всем элементам Наследуемо: нет Проценты: не используются Устройства: визуальные Поддержка : Соответствует стандарту (4.0+) Соответствует стандарту (4.0+) Свойство background-image задает графический образ фона элемента при отображении. Значение none, принятое по умолчанию, означает отсутствие фонового образа. Примеры: BODY { background-image: url("marble.gif") } P { background-image: none } Примечание. При задании этого свойства следует задавать также свойство background-color на случай невозможности загрузки графического образа. Если заданы оба эти свойства, то цвет фона будет виден в прозрачных областях образа. Повтор фонового образа: свойство background-repeat Синтаксис: background-repeat: repeat | repeat-x | repeat-y | no-repeat | inherit Начально: repeat Применимо: ко всем элементам Наследуемо: нет Проценты: не используются Устройства: визуальные Поддержка : Соответствует стандарту (4.0+) Не поддерживается Если задан графический образ фона, то свойство background-repeat задает повтор фонового образа при отображении. Его возможные значения: repeat Образ повторяется по горизонтали и вертикали. repeat-x Образ повторяется только по горизонтали. repeat-y Образ повторяется только по вертикали. no-repeat Образ не повторяется: отображается только одна его копия. Пример: BODY { background: white url("image.gif"); background-repeat: repeat-y; background-position: center; } Прокрутка фонового образа: свойство background-attachment Синтаксис: background-attachment: scroll | fixed | inherit Начально: scroll Применимо: ко всем элементам Наследуемо: нет Проценты: не используются Устройства: визуальные Поддержка : Соответствует стандарту (4.0+) Не поддерживается Если задан графический образ фона, то свойство background-attachment задает прокрутку фонового образа при отображении. Его возможные значения: scroll Образ прокручивается вместе с документом. fixed Образ зафиксирован и не прокручивается. Пример: BODY { background: white url("image.gif"); background-repeat: repeat-y; background-attachment: fixed; } Позиция фонового образа: свойство background-position Синтаксис: background-position: [[<размер> | <процент>] {1,2} | [[top | center | bottom] || [left | center | right]]] | inherit Начально: 0% 0% Применимо: к блочным и внешним элементам Наследуемо: нет Проценты: относительно размеров объемлющего прямоугольника Устройства: визуальные Поддержка : Соответствует стандарту (4.0+) Не поддерживается Если задан графический образ фона, то свойство background-position задает позицию фонового образа при отображении. Его возможные значения: <размер> <размер> Если эта пара значений равна "2cm 3cm", то левый верхний угол образа помещается на 2 см правее и 3 см ниже левого верхнего угола области заполнителя. <процент> <процент> Если эта пара значений равна "0% 0%", то левый верхний угол образа совмещается с левым верхним углом области заполнителя. Если эта пара значений равна "100% 100%", то правый нижний угол образа совмещается с правым нижним углом области заполнителя. Если эта пара значений равна "10% 80%", то левый верхний угол образа помещается на 10% правее и 80% ниже левого верхнего угола области заполнителя. Если задано только одно значение, то оно считается позицией по горизонтали, а позиция по вертикали принимается равной 50%. Если даны два значения, то позиция по горизонтали стоит первой. Разрешаются комбинации размеров и процентов, например "2cm 30%". Отрицательные позиции также допустимы. Кроме того, значение этого свойства может задаваться следующими комбинациями ключевых слов (и только ими): top left = left top То же, что "0% 0%". top = top center = center top То же, что "50% 0%". right top = top right То же, что "100% 0%". left = left center = center left То же, что "0% 50%". center = center center То же, что "50% 50%". right = right center = center right То же, что "100% 50%". bottom left = left bottom То же, что "0% 100%". bottom = bottom center = center bottom То же, что "50% 100%". bottom right = right bottom То же, что "100% 100%". Пример: BODY { background-image: url("banner.jpg"); background-position: top center; } Если фоновый образ зафиксирован (см. свойство background-attachment), то его смещения вычисляются относительно окна обозревателя, а не области заполнения элемента. В следующем примере фоновый образ будет размещен в правом нижнем углу окна обозревателя. BODY { background-image: url("logo.png"); background-attachment: fixed; background-position: 100% 100%; background-repeat: no-repeat; } Свойства фона: свойство background Синтаксис: background: [ <background-color> || <background-image> || <background-repeat> || <background-attachment> || <background-position> ] | inherit Начально: не определено для сокращений Применимо: ко всем элементам Наследуемо: нет Проценты: применимы только в Устройства: визуальные Поддержка : Соответствует стандарту (4.0+) Не поддерживается Свойство background является сокращением для свойств background-color, background-image, background-repeat, background-attachment и background-position. Оно позволяет задать все свойства фона одновременно. При этом сначала всем свойствам фона присваиваются их начальные значения, а затем изменяются значения тех свойств, которые явно заданы в данном свойстве. В первом правиле следующего примера задается только цвет фона, во втором указаны все свойства фона: BODY { background: blue } P { background: url("bkgrd.gif") gray 50% repeat fixed } Примечание. Во избежании конфликта с пользовательской таблицей стилей, это свойство следует задавать вместе со свойством color.  8  Комментарии к статье  8 8  Обсудить в чате

8  В тему Введение в таблицы стилей Селекторы, псевдоклассы и псевдоэлементы Значения свойств, каскадность и наследование Границы, заполнители и рамки Позиционирование элементов Визуализация элементов Шрифты Текст Таблицы Генерация содержимого, нумерация и списки Страничные устройства вывода Звуковые таблицы стилей