Batas CSS
Properti perbatasan CSS memungkinkan Anda untuk menentukan gaya, lebar, dan warna perbatasan elemen.
Saya memiliki perbatasan di semua sisi.
Saya memiliki batas bawah merah.
Saya memiliki batas yang membulat.
Gaya Perbatasan CSS
Properti border-style
menentukan jenis perbatasan apa yang akan ditampilkan.
Nilai berikut diperbolehkan:
dotted
- Mendefinisikan batas putus-putusdashed
- Mendefinisikan batas putus-putussolid
- Mendefinisikan perbatasan yang soliddouble
- Mendefinisikan perbatasan gandagroove
- Mendefinisikan perbatasan beralur 3D. Efeknya tergantung pada nilai warna batasridge
- Mendefinisikan perbatasan bergerigi 3D. Efeknya tergantung pada nilai warna batasinset
- Mendefinisikan batas sisipan 3D. Efeknya tergantung pada nilai warna batasoutset
- Mendefinisikan batas awal 3D. Efeknya tergantung pada nilai warna batasnone
- Mendefinisikan tanpa batashidden
- Mendefinisikan perbatasan tersembunyi
Properti border-style
dapat memiliki satu hingga empat nilai (untuk batas atas, batas kanan, batas bawah, dan batas kiri).
Contoh
Demonstrasi gaya perbatasan yang berbeda:
p.dotted {border-style: dotted;}
p.dashed
{border-style: dashed;}
p.solid {border-style: solid;}
p.double
{border-style: double;}
p.groove {border-style: groove;}
p.ridge
{border-style: ridge;}
p.inset {border-style: inset;}
p.outset
{border-style: outset;}
p.none {border-style: none;}
p.hidden {border-style: hidden;}
p.mix {border-style: dotted dashed solid double;}
Hasil:
A dotted border.
A dashed border.
A solid border.
A double border.
A groove border. The effect depends on the border-color value.
A ridge border. The effect depends on the border-color value.
An inset border. The effect depends on the border-color value.
An outset border. The effect depends on the border-color value.
No border.
A mixed border.
Catatan: Tak satu pun dari properti perbatasan CSS LAIN (yang akan Anda pelajari lebih lanjut di bab berikutnya) akan memiliki efek APAPUN kecuali
border-style
properti disetel!