Справочник по CSS : Тематический указатель : Справочник по свойствам и атрибутам : Цвет и фон : background

смотрим также

Материал из Справочник Web-языков

Перейти к: навигация, поиск


Содержание

Атрибут background | Свойство background

Задает от 1 до 5 свойств фона для объекта.

Синтаксис

HTML { background : sBackground }
Скрипты [ sBackground = ] object.style.background

Возможные значения

sBackground
Строка, которая может определять и принимать одно или несколько из следующих значений, значения описываются в любом порядке:
color Любое из диапазона возможных значений цвета, доступных для свойства backgroundColor.
image Любое из диапазона возможных изображений, доступных для свойства backgroundImage.
repeat Любое из диапазона возможных значений, доступных для свойства backgroundRepeat.
attachment Любое из диапазона возможных значений стиля, доступных для свойства backgroundAttachment.
position Любое из диапазона возможных значений, доступных для свойства backgroundPosition.
-moz-linear-gradient
-moz-repeating-linear-gradient
-moz-radial-gradient
-moz-repeating-radial-gradient

Это свойство не наследуется.

Значением по умолчанию для background является transparent none repeat scroll 0% 0%.

Замечания

Свойство background является составным. Разумеется, можно использовать отдельные свойства для задания параметров объекта, но, как правило, более удобным является их задание внутри одного составного свойства.

Если при задании составного свойства для фона некоторые его отдельные свойства не описаны, то им назначаются значения по умолчанию. Например, значением по умолчанию для изображения является none. Таким образом, если вы напишите background: white, то это будет эквивалентно записи background: white none repeat scroll 0% 0%. То есть, дополнительно к тому, что фоновым цветом будет установлен белый, также отменяются все настройки для повторения, прокрутки, изображения и позиционирования фона, установленные ранее.

Фон с настроенными свойствами отображается позади контента объекта и отступов (padding). Однако, свойства для границы (border) задаются отдельно; например, цвет фона на нее не влияет.

Поддерживаемые браузерами цвета фона можно посмотреть в таблице Коды и названия цветов в HTML.

Примеры

Следующие примеры иллюстрируют применение свойства background и атрибута background для задания различных параметров фона объекта.

В первом примере используется атрибут background для изменения фонового цвета (background-сolor) и расположения (background-position) изображения при наведении курсора мыши на него.

<STYLE>
.style1{background:beige url(sphere.jpg) no-repeat top center}
.style2{background:ivory url(sphere.jpeg) no-repeat bottom right}
</STYLE>
</HEAD> 
<BODY>
<SPAN onmouseover="this.className='style1'"
    onmouseout="this.className='style2'">
. . .  </SPAN>

Во втором примере для изменения фонового цвета (backgroundСolor) и расположения (backgroundPosition) изображения при клике мышью по нему используется свойство background.

<SPAN onclick="this.style.background='beige url(sphere.jpeg) 
  no-repeat top center'">
. . . </SPAN>

Стандарты

Это свойство определено в World Wide Web Consortium (W3C) Document Object Model (DOM) Level 1 и Cascading Style Sheets (CSS), Level 1 (CSS1)

Поддерживаемые браузеры

Internet Explorer 5.5, 6.0, 7.0, 8.0

Opera 7.0, 8.0, 9.2, 9.5

Safari 1.3, 2.0, 3.1

Firefox 1.5, 2.0, 3.0

Ссылки на источники

http://msdn.microsoft.com/en-us/library/ms530722(VS.85).aspx

https://developer.mozilla.org/en/CSS/background

Добавить страницу в закладки:
РАЗРЕШАЕТСЯ перепечатывать и копировать информацию ТОЛЬКО ПРИ РАЗМЕЩЕНИИ ссылки на оригинал!
(<A href="http://www.spravkaweb.ru/">Справочник Web-языков</A>)
другие проекты
Rambler\'s Top100 Индекс цитирования