Справочник по CSS : Тематический указатель : Справочник по свойствам и атрибутам : Цвет и фон : background-image
смотрим также
Материал из Справочник Web-языков
Содержание |
Атрибут background-image | Свойство backgroundImage
Это свойство задает фоновое изображение для объекта.
Синтаксис
HTML | { background-image : sLocation } |
Скрипты | [ sLocation = ] object.style.backgroundImage |
Возможные значения
- sLocation
- Строка, которое может определять и принимать одно из следующих значений:
none Значение по умолчанию. Фоновым цветом объекта становится цвет его родительского элемента. url(sUrl) Определяет путь до изображения. Он может быть относительный (URL) или абсолютный (sUrl). -moz-linear-gradient -moz-repeating-linear-gradient -moz-radial-gradient -moz-repeating-radial-gradient
Значением по умолчанию является none. Свойство не наследуется.
Замечания
URL однозначно определяет путь до изображения.
При этом наряду с картинкой, желательно задать еще и фоновый цвет. Он будет отображаться, пока графический файл не загрузится или, например, если отключен показ изображений в браузере, или если на изображении есть прозрачные области. Когда картинка загрузится, оно автоматически перекроет фоновый цвет.
Значение этого свойства можно задать в составном свойстве (background).
Примеры
Следующие примеры иллюстрируют применение свойства backgroundImage и атрибута background-image.
В первом примере используется атрибут background-image, чтобы показывать фоновое изображение (при наведении курсора мыши на объект) или скрывать его (курсор мыши "уходит" с объекта).
<style type="text/css"> .setUrl { background-image: url(sphere.jpg); } .loseUrl { background-image: url(none); } </style> </head> <body> <span style="font-size: 14px" onmouseover="this.className='setUrl'" onmouseout="this.className='loseUrl'"> . . . </span>
Во втором примере используется свойство backgroundImage, чтобы показывать или скрывать фоновое изображение.
<span onmouseover="this.style.backgroundImage='url(sphere.jpeg)'"> . . . </span>
Стандарты
Это свойство определено в 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
Ссылки на источники
https://msdn.microsoft.com/en-us/library/ms530717(VS.85).aspx