Properti border-block-style CSS

Halaman sebelumnya border-block-start-width
Halaman berikutnya border-block-width

definisi dan penggunaan

border-block-style properti mengatur gaya border elemen dalam arah blok.

border-block-style nilai properti dapat diatur dengan berbagai cara:

jika border-block-style properti ini memiliki dua nilai:

border-block-style: dashed dotted;

gaya border di awal blok adalah garis gugur
gaya border di akhir blok adalah garis titik

jika border-block-style properti ini memiliki satu nilai:

border-block-style: dashed;

gaya border di awal dan akhir blok adalah garis gugur

CSS border-block-style sifat border dengan properti CSS border-bottom-style、border-left-style、border-right-style dan border-top-style Sama seperti, tapi border-block-style Atribut ini tergantung pada arah blok.

Perhatian:atribut CSS yang berhubungan writing-mode Mendefinisikan arah blok. Ini akan mempengaruhi posisi awal dan akhir blok, serta border-block-style Hasil atribut. Untuk halaman berbahasa Inggris, arah in-line dari kiri ke kanan, arah blok ke bawah.

Contoh

Contoh 1

Atur gaya border di arah blok:

#example1 {
  border-block-style: solid;
}
#example2 {
  border-block-style: dashed dotted;
}

Coba sendiri

Contoh 2: Gabungan atribut writing-mode

Posisi border di awal dan akhir arah blok dipengaruhi oleh writing-mode Dampak atribut:

div {
  writing-mode: vertical-rl;
  border-block-style: dotted;
}

Coba sendiri

Syntaks CSS

border-block-style: none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|initial|inherit;

Nilai atribut

Nilai	Deskripsi
none	Nilai standar. Tentukan tanpa border.
hidden	Sama seperti none, kecuali dalam resolusi konflik border di elemen tabel.
dotted	Tentukan border titik.
dashed	Tentukan border garis tipis.
solid	Tentukan border garis tunggal.
double	Tentukan border garis ganda.
groove	Tentukan border lubang 3D. Efek tergantung dari nilai border-color.
ridge	Tentukan border loncat 3D. Efek tergantung dari nilai border-color.
inset	Tentukan border imbas 3D. Efek tergantung dari nilai border-color.
outset	Tentukan border ekspresi 3D. Efek tergantung dari nilai border-color.
initial	Atur atribut ini ke nilai standarnya. Lihat: initial.
inherit	Mengambil atribut ini dari elemen induknya. Lihat: inherit.

Detil teknis

Nilai standar:	none
Inheritsi:	Tidak
Pembuatan animasi:	Tidak didukung. Lihat:Atribut yang berhubungan dengan animasi.
Versi:	CSS3
Syntaks JavaScript:	object.style.borderBlockStyle="dotted"