CSS border-image-slice Property

❮ Poprzedni Pełne odniesienie CSS Dalej _

Przykład

Określ, jak pokroić obraz obramowania:

#borderimg {
border-image-slice: 30%;
}

Definicja i użycie

Właściwość border-image-sliceokreśla, jak podzielić obraz określony przez border-image-source . Obraz jest zawsze pocięty na dziewięć części: cztery rogi, cztery krawędzie i środek.

Część „środkowa” jest traktowana jako w pełni przezroczysta, chyba że ustawiono słowo kluczowe fill.

Wskazówka: spójrz także na właściwość border-image (skrócona właściwość do ustawiania wszystkich właściwości border-image-*).

Domyślna wartość:	100%
Dziedziczny:	nie
Animowalny:	nie. Przeczytaj o animacji
Wersja:	CSS3
Składnia JavaScript:	obiekt .style.borderImageSlice="30%"

Obsługa przeglądarki

Liczby w tabeli określają pierwszą wersję przeglądarki, która w pełni obsługuje tę właściwość.

Property
border-image-slice	15.0	11.0	15.0	6.0	15.0

Składnia CSS

border-image-slice: number|%|fill|initial|inherit;

Uwaga: Właściwość border-image-slicemoże przyjmować od jednej do czterech wartości. Jeśli czwarta wartość zostanie pominięta, jest taka sama jak druga. Jeśli pominięto również trzecią, jest ona taka sama jak pierwsza. Jeśli pominięto również drugą, to jest ona taka sama jak pierwsza.

Wartości nieruchomości

Value	Description	Play it
number	The number(s) represent pixels for raster images or coordinates for vector images
%	Percentages are relative to the height or width of the image
fill	Causes the middle part of the image to be displayed
initial	Sets this property to its default value. Read about initial
inherit	Inherits this property from its parent element. Read about inherit

Powiązane strony

Samouczek CSS: obrazy obramowania CSS

Dokumentacja CSS: właściwość border-image

CSS Reference: border-image-outset property

CSS Reference: border-image-repeat property

Dokumentacja CSS: właściwość border-image-source

CSS Reference: właściwość border-image-width

Dokumentacja HTML DOM: właściwość borderImageSlice