Properti border-block-end-style CSS

Halaman sebelumnya border-block-end-color
Halaman berikutnya border-block-end-width

Definisi dan penggunaan

border-block-end-style aturan digunakan untuk menetapkan gaya garis bawah elemen di ujung arah blok.

CSS border-block-end-style aturan dengan border-bottom-style、border-left-style、border-right-style dan border-top-style Atribut sangat mirip, tetapi border-block-end-style Atribut ini tergantung pada arah blok.

Perhatian：atribut CSS yang berhubungan writing-mode Definisi arah blok. Ini akan mempengaruhi titik awal dan akhir blok serta border-block-end-style Hasil atribut. Untuk halaman berbahasa Inggris, arah teks dalam garis adalah dari kiri ke kanan, dan arah blok adalah ke bawah.

Contoh

Contoh 1

Atur gaya border di ujung belakang arah blok：

div {
  border-block-end-style: dotted;
}

Coba sendiri

Contoh 2: Kombinasi atribut writing-mode

Lokasi border style di ujung belakang arah blok dipengaruhi oleh writing-mode Pengaruh atribut：

div {
  border-block-end-style: solid;
  writing-mode: vertical-rl;
  border-block-end-width: 5px;
}

Coba sendiri

Syntaks CSS

border-block-end-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", tetapi berbeda dalam resolusi konflik border di elemen tabel.
dotted	Tentukan border dengan titik.
dashed	Tentukan border dengan garis ganda.
solid	Tentukan border dengan garis lurus.
double	Tentukan border dengan garis ganda.
groove	Tentukan border yang terdalam 3D. Efek tergantung dari nilai border-color.
ridge	Tentukan border yang terukir 3D. Efek tergantung dari nilai border-color.
inset	Tentukan border yang tergabung 3D. Efek tergantung dari nilai border-color.
outset	Tentukan border yang ekspansi 3D. Efek tergantung dari nilai border-color.
initial	Atur sifat ini ke nilai standarnya. Lihat initial。
inherit	Mengambil sifat ini dari elemen induknya. Lihat inherit。

Detil teknis

Nilai standar：	none
Inheritance：	Tidak
Pembuatan animasi：	no. Baca tentang animatable
Versi：	CSS3
Syntaks JavaScript：	object.style.borderBlockEndStyle="dotted"