Sifat border-image-slice CSS

Definisi dan penggunaan

Sifat border-image-slice menentukan penjauan ke dalam gambar border.

Lihat juga:

Panduan CSS3:Border CSS3

Contoh

Tentukan penjauan ke dalam gambar border:

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

Syarat CSS

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

Keterangan:Sifat ini menentukan penjauan ke dalam bagian atas, kanan, bawah, dan kiri gambar, gambar disingkat menjadi sembilan area: empat pojok, empat sisi, dan area tengah. Jika tidak digunakan kata kunci fill, bagian gambar tengah akan diabaikan. Jika angka keempat diabaikan, maka sama seperti nilai kedua. Jika angka ketiga diabaikan, maka sama seperti nilai pertama. Jika angka kedua diabaikan, maka sama seperti nilai pertama.

Nilai sifat

Nilai Deskripsi
number Nilai angka, mewakili piksel dalam gambar (jika gambar vektor) atau koordinat vektor (jika gambar vektor).
% Persenbanding ukuran gambar: persen lebar mempengaruhi penjauhan horizontal, tinggi mempengaruhi penjauhan vertikal.
fill Pertahankan bagian tengah gambar border.

Detil teknologi

Nilai baku: 100%
Warisan: tidak
Versi: CSS3
Syarat JavaScript: object.style.borderImageSlice="50% 50%"

Perebutan perebutan

Angka di dalam tabel menunjukkan versi perebutan penuh sifat ini pertama kalinya.

Chrome IE / Edge Firefox Safari Opera
15.0 11.0 15.0 6.0 15.0

Lihat: border-image sifat.