Border-image-slice häsiýeti

border-image-slice häsiýeti brauzere, suratyň haýsy bölekleriniň burçlara, haýsylarynyň bolsa gapdallara gitjekdigini (we haýsy bölegiň merkezi boljakdygyny) görkezýär. Burçlara 4 bölek, gapdallara 4 bölek we bir bölek (merkezi) elementuň fonyna gitjek (islegli, fill açar sözi).

Giňişleýin maglumat üçin border-image häsiýetine serediň.

Sintaksis

<+css+> selektor { border-image-slice: 1-den 4-e çenli san | 1-den 4-e çenli göterim; } <-css->

Sanlar we göterimler bilen birlikde bosluk arkaly fill açar sözi hem ýazylýar.

Görnüşleri

Görnüşi	Düşündiriş
göterim	Göterimler suratyň ölçegine garaşly hasaplanýar. Goňşy göterimler ini göre, dik göterimler bolsa beýiklige göre.
sanlar	Sanlar - piksel (raster surat üçin) ýa-da koordinatalar (wektor surat üçin). Ölçeg birlikleri görkezilmeýär.
`fill`	Adaty ýörelge, suratyň merkezi böleginiň taşlanyjakdygyny öz içine alýar. Ony ulanylmak üçin, sanlara ýa-da göterimlere goşmaça `fill` açar sözini ulanmaly.

Parametrleriň sany

Çyzgysy 1, 2, 3 ýa-da 4 parametr alyp biler. Diňe bir ýatdan çykarmaň, çyzgynyň üçin ölçeg birlikleri ýazylmaýar (meselem, diňe 20, 20px däl). Şeýle hem çyzgyny % bilen görkezip bolýar.

Parametrleriň sany	Düşündiriş
`1`	Hemme tarap üçin bir wagtyň özünde çyzgy.
`2`	1 2; - ýokarky we aşak üçin `1px`, çep we sag üçin `2px`.
`3`	`1 2 3`; - ýokarky üçin `1px`, çep we sag üçin `2px`, aşak üçin `3px`.
`4`	`1 2 3 4`; - ýokarky üçin `1px`, sag üçin `2px`, aşak üçin `3px`, çep üçin `4px`.

Adaty bahasy: 100%(?).

Mysal

<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;
}

Mysal

<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;
}

Şeýle-de serediň

border-image häsiýeti,
syýahat serheti üçin gysgaldyş
border-image-source häsiýeti,
syýahat serheti üçin suratyň ýoluny görkezýär
border-image-repeat häsiýeti,
syýahat serheti üçin suratyň gaýtalanmagy
border-image-width häsiýeti,
syýahat serheti üçin suratyň ölçegini görkezýär
border-image-outset häsiýeti,
syýahat serheti üçin suratyň çyzgysyny görkezýär