Рейтинг@Mail.ru
УРОКИ CSS CSS3 ПРИМЕРЫ CSS СПРАВОЧНИК CSS РЕКЛАМА

CSS3 Свойство border-image-slice


CSS Справочник Полный CSS Справочник

Пример

Указать внутренние смещения для изображения-границы:

div
{
border-image-source: url(border.png);
border-image-slice: 50% 50%;
}

Поддержка Браузерами

Internet Explorer Firefox Opera Google Chrome Safari

Свойство border-image-slice не поддерживается ни одним из основных браузеров.

Взгляните лучше на свойство border-image!


Определение и Использование

Свойство border-image-slice указывает внутренние смещения изображения-границы.

Значение по умолчанию: 100%
Наследуется: нет
Версия: CSS3
JavaScript синтаксис: объект.style.borderImageSlice="50% 50%"


Синтаксис

border-image-slice: число|%|fill;

Замечание: Это свойство указывает внутренние смещения от верхнего, правого, нижнего и левого краев изображения, разделяя его на девять регионов: четыре угла, четыре боковых стороны и середины. Часть изображения в середине игнорируется (трактуется как полностью прозрачная), если не указано ключевое слово fill. Если четвертое значение/процентное отношение не указано, оно приравнивается ко второму, если третье значение также не указано, оно приравнивается к первому. Если и второе значение пропущено, оно принимается равным первому.

Значение Описание
число Числа представляют пикселы изображения (если изображение является растровым) или векторные координаты (если изображение является векторным)
% Процентные отношения Указываются относительно размера изображения: ширины изображения для вертикальных смещений, высота - для вертикальных смещений
fill Указывает, что средняя часть изображения должна сохраняться


CSS Справочник Полный CSS Справочник

© 2011-2017 Уроки CSS
Рейтинг@Mail.ru