• Теория
  • Теория

Изображение рамки: border-image-repeat, часть 2

Значение round свойства border-image-repeat тоже устанавливает режим заполнения стороны рамки повторяющимися боковыми участками картинки. Но, в отличие от repeat, если в ширину стороны не вмещается целое число повторяющихся кусочков, крайние части не обрезаются. Кусочки при этом равномерно растягиваются так, чтобы все они стали одного размера и заняли оставшееся место стороны рамки.

Согласно спецификации при заданном значении space алгоритм похож на round, только для компенсации оставшегося места кусочки картинки не растягиваются, а остаются прежней ширины, при этом между кусочками появляется дополнительное свободное пространство.

Проверим значения свойств на практике.

На момент создания части в современных браузерах реализация свойства space идентична свойству repeat.

Минимальный вид табов
  • index.html
HTML
HTML

Вы перешли на другую страницу

Кликните внутри мини-браузера, чтобы поставить фокус в это окно.

100%
Бабушка Кекс

Притормози, дружище

Проходить вызовы части «Рамки и фоны. Погружение» тренажёра «Продвинутая работа с фонами и рамками» можно после регистрации и оформления подписки.