② Источник изображения: свойство background-image

Продолжим изучение темы CSS - фон. Если пропустили прошлую статью, то вот ссылка на неё:

① Базовый цвет: свойство background-color

Свойство background-image устанавливает фоновое изображение (одно или несколько) элемента. Значение none считается слоем изображения, но ничего не рисует. Изображение, которое является пустым (нулевой ширины или нулевой высоты), которое не загружается или не может быть отображено (например, потому что оно не в поддерживаемом формате изображения) также считается слоем, но ничего не рисует.

Семантически важные изображения должны предоставляться в разметке документа, например, с тегом <img>.

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

background-image

Значения:

изображение - Обозначает 2D-изображение. Это может быть ссылка на URL, нотация image() или запись градиента. Значение по умолчанию none.
inherit - Наследует значение свойства от родительского элемента.

Синтаксис

CSS

background-image: none;
background-image: url(http://site.ru/rose.png);
background-image: url(tl.png), url(tr.png);
background-image: linear-gradient(white, gray);
background-image: repeating-radial-gradient(circle closest-side at 20px 30px, red, yellow, green 100%, yellow 150%, red 200%);
background-image: image("sprites.svg#xywh=40,0,20,20");
background-image: inherit;

Продолжение в следующей статье!