Справочник по CSS : Тематический указатель : Справочник по свойствам и атрибутам : Цвет и фон : background-image
Материал из Справочник Web-языков.
Содержание |
[править] Атрибут background-image | Свойство backgroundImage
Это свойство задает фоновое изображение для объекта.
[править] Синтаксис
| HTML | { background-image : sLocation } |
| Скрипты | [ sLocation = ] object.style.backgroundImage |
[править] Возможные значения
- sLocation
- Строка, которое может определять и принимать одно из следующих значений:
none Значение по умолчанию. Фоновым цветом объекта становится цвет его родительского элемента. url(sUrl) Определяет путь до изображения. Он может быть относительный (URL) или абсолютный (sUrl).
Значением по умолчанию является 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>
[править] Стандарты
Это свойство определено в
[править] Поддерживаемые браузеры
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
[править] Ссылки на источники
