-webkit-border-image

Свойство -webkit-border-image позволяет одновременно задать фоновое изображение границы элемента, разбить его на фрагменты, указать размер контура, а также указать способ отображения боковых фрагментов фонового изображения.

Допустимые значения

Единственное отличие от стандартных значений — это невозможность сделать прозрачной середину рисунка.

Значение по умолчанию none
Применимо ко всем элементам
Наследование нет
Поддерживается браузерами
  • Safari 3.0 и выше
  • Chrome 1.0 и выше

Пример

CSS
.block {
-webkit-border-image: (http://www.xiper.net/assets/images/logo.jpg) 13 1 9 13 / 10px 1px 6px 10px stretch round;
}

Заметки

В спецификации CSS3 есть аналогичное свойство border-image. Единственное отличие от спецификации — это невозможность указать необязательный параметр border-image-outset, а также непрозрачная середина рисунка.

Также в качестве границы вместо картинки можно задать -webkit-gradient.

По теме