⑤ Повтор рамки-изображения

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

Свойство управляет заполнением фоновым изображением пространства между углами рамки. Можно задавать как с помощью одного значения, так и с помощью пары значений.

border-image-repeat

Значения:

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

Синтаксис

CSS

div {border-image-repeat: repeat;}

📷 РИС. 7. ПРИМЕР ПОВТОРА ЦЕНТРАЛЬНОЙ ЧАСТИ РАМКИ-ИЗОБРАЖЕНИЯ С ПОМОЩЬЮ РАЗЛИЧНЫХ ТИПОВ ЗНАЧЕНИЙ

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