Border-image-slice xassəsi

border-image-slice xassəsi brauzerə şəklin hansı hissələrinin künclərə, hansılarının isə tərəflərə gedəcəyini göstərir (və hansı hissənin mərkəzi olacağını). Künclərə 4 hissə, tərəflərə 4 hissə və bir hissə (mərkəzi) elementin fonuna gedir (istəyə bağlı olaraq, fill açar sözü).

Ətraflı məlumat üçün border-image xassəsinə baxın.

Sintaksis

<+css+> selektor { border-image-slice: 1-ci 1-dən 4-cü 4-ə qədər rəqəmlər | 1-ci 1-dən 4-cü 4-ə qədər faizlər; } <-css->

Rəqəmlər və faizlərlə birlikdə boşluqla fill açar sözü də yazıla bilər.

Qiymətlər

Qiymət	İzah
faizlər	Faizlər şəklin ölçüsünə nisbətən hesablanır. Üfüqi olanlar enə, şaquli olanlar isə hündürlüyə nisbətən.
rəqəmlər	Rəqəmlər - piksellərdir (raster şəkillər üçün) və ya koordinatlardır (vektor şəkillər üçün). Ölçü vahidləri göstərilmir.
`fill`	Standart davranış, şəklin mərkəzi hissəsinin atılacağını nəzərdə tutur. Onu işlətmək üçün, rəqəmlərə və ya faizlərə əlavə olaraq `fill` açar sözündən istifadə etmək lazımdır.

Parametrlərin sayı

Yerdəyişmə 1, 2, 3 və ya 4 parametr qəbul edə bilər. Diqqət edin ki, yerdəyişmə üçün ölçü vahidləri yazılmır (məsələn, sadəcə 20, 20px deyil). Həmçinin qalınlığı % ilə də təyin etmək olar.

Parametrlərin sayı	İzah
`1`	Bütün tərəflər üçün eyni vaxtda qalınlıq.
`2`	1 2; - üst və alt üçün `1px`, sol və sağ üçün `2px`.
`3`	`1 2 3`; - üst üçün `1px`, sol və sağ üçün `2px`, alt üçün `3px`.
`4`	`1 2 3 4`; - üst üçün `1px`, sağ üçün `2px`, alt üçün `3px`, sol üçün `4px`.

Standart qiymət: 100%(?).

Nümunə

<div id="elem"></div>

#elem {
	border-image-source: url("image.png");
	border-image-slice: 26;
	border-style: solid;
	border-width: 26px;
	width: 200px;
	height: 200px;
	background: green;
	margin: 0 auto;
}

Nümunə

<div id="elem"></div>

#elem {
	border-image-source: url("image.png");
	border-image-slice: 26;
	border-image-repeat: repeat;
	border-style: solid;
	border-width: 26px;
	width: 200px;
	height: 200px;
	background: green;
	margin: 0 auto;
}

Həmçinin bax

border-image xassəsi,
bu, şəkil-sərhəd üçün qısaldılmış yazılışdır
border-image-source xassəsi,
bu, sərhəd üçün şəklin yolunu təyin edir
border-image-repeat xassəsi,
bu, sərhəd üçün şəklin təkrarlanmasıdır
border-image-width xassəsi,
bu, sərhəd üçün şəklin ölçüsünü təyin edir
border-image-outset xassəsi,
bu, sərhəd üçün şəklin yerdəyişməsini təyin edir