CSS свойство border-image-repeat

Устанавливает способ заполнения фоновым изображением пространства между углами рамки.

Свойство border-image-repeat определяет, каким способом изображение будет масштабироваться и выкладываться для краев и середины пространства рамки. Таким образом, данное свойство может принимать до двух значений. Если второе значение не используется, то оно принимается равным первому значению.

CSS синтаксис

border-image-repeat: stretch | repeat | round | space | initial | inherit;

Возможные значения

ЗначениеОписание
stretchЗначение по умолчанию. Изображение растягивается, чтобы занять все пространство рамки.
repeatПовторяет заполняющую часть изображения, при этом видны места стыков с угловой частью, и если длины образца не хватает, то он растягивается.
roundНаиболее точно заполняет промежуток между углами рамки, дублируя заполняющую часть изображения, при этом может образовать стыки по середине стороны рамки.
spaceПохоже на значение repeat, но если длины образца не хватает, то свободное пространство заполняется пустотой.
inheritЗначение наследуется от родительского элемента.
initialУстанавливает значение по умолчанию.

Пример использования

Устанавливаем способ повторного отображения изображения-рамки


#borderimg {
     border-image-source: url(border.png);
     border-image-repeat: repeat;
}