Свойство background-image в CSS позволяет определить одно или несколько фоновых изображений для элемента. Это свойство открывает двери для создания красочных и динамичных дизайнов, добавляя визуальную глубину к элементам.
Совет: Фон элемента — это общий размер элемента, включая отступы и границы (но не поля).
Совет: Всегда задается фоновый цвет , который будет использоваться, если изображение недоступно.
| Значение по умолчанию: | none |
| Inherited: | no |
| Animatable: | no |
| Version: | CSS1 + new values in CSS3 |
| Синтаксис JavaScript: | object.style.backgroundImage="url(img_tree.gif)" |
Поддержка браузера
| Свойство: | background-image |
| Chrome | 1.0 |
| Explorer/Edge | 4.0 |
| Firefox | 1.0 |
| Safari | 1.0 |
| Opera | 3.5 |
Синтаксис CSS
background-image: url|none|initial|inherit;
Значения свойств
| Значение | Описание |
| url('URL') | URL-адрес изображения. Чтобы указать более одного изображения, разделите URL-адреса запятой |
| none | Фоновое изображение не будет отображаться. Это значение по умолчанию |
| linear-gradient() | Задает линейный градиент в качестве фонового изображения. Определите по крайней мере два цвета (сверху вниз) |
| radial-gradient() | Задает радиальный градиент в качестве фонового изображения. Определите по крайней мере два цвета (по центру к кромкам) |
| repeating-linear-gradient() | Повторяет линейный градиент |
| repeating-radial-gradient() | Повторяет радиальный градиент |
| initial | Присваивает этому свойству значение по умолчанию. |
| inherit | Наследует это свойство из родительского элемента. |