| Версия CSS | все |
| Применение | любые элементы |
| Значение (по умолчанию) | none |
Это свойство позволяет установить фоновое изображение для любого элемента, в т.ч. и для всей страницы, а так же, при использовании свойства linear-gradient установить два различных цвета для верхней части и нижней, при этом один цвет будет плавно перетекать в другой.
Если установленное фоновое изображение имеет размер меньше, чем элемент, оно будет повторяться; при этом вы можете настроить варианты повторения.
Если в браузере пользователя отключен показ изображений, то будет выводиться указанный цвет фона, поэтому в некоторых случаях есть смысл указывать оба свойства одновременно.
| Значение | Действие |
| none | Изображения нет или оно отменено |
| url | Указывает путь к файлу. Синтаксис: url(путь). Путь указывается относительно корня сайта (см. пример кода); если элемент (например, шаблон) имеет свою папку ("images"), полный путь можно не указывать, достаточно только указать имя файла. |
| inherit | Наследует изображение "родителя". |
| linear-gradient | Устанавливает два различных цвета для верха и низа, при этом один цвет плавно перетекает в другой. Синтаксис для данного варианта см. в "Примерах кода". |
Соблюдение указанных значений и отображение фона зависит от браузера пользователя; некоторые значения могут не работать.
Примеры кода:
1 {
2 background-image: url(/images/Fon.jpg);
3 }1 {
2 background-image: linear-gradient(to bottom, RGB(0,255,255), RGB(0,0,255));
3 }
Во втором примере указано, что откуда начинается градиент (to bottom), начальный цвет и конечный цвет. Начало градиента может быть задано с любой стороны (top, right, bottom, left), или с любого угла (прописывается два значения через запятую).