Ada banyak jenis gaya CSS Border Style yang bisa kita buat. CSS Border Style lebih jadi menarik dan cantik jika dipadukan dengan banyak warna / kombinasi CSS Border Style yang satu dengan yang lain.
Berikut macam-macam CSS Border Style dan contoh nya:
Ket:
- border: 4px atau border: 2px adalah tebal dari border.
- background:#0F192A adalah kode untuk warna background.
- padding: 10px adalah jarak antara tulisan dengan border.
- width: 500px adalah lebar dari kotak.
CSS Border Style-solid
<div style="border: 2px solid #909090; padding: 10px; width: 500px; background:#0F192A; ">CSS Border Style-solid</div>
CSS Border Style-double
<div style="border: 4px double #909090; padding: 10px; width: 500px;background:#0F192A;">CSS Border Style-double</div>
CSS Border Style-groove
<div style="border: 4px groove #909090; padding: 10px; width: 500px;background:#0F192A;">CSS Border Style-groove</div>
CSS Border Style-dotted
<div style="border: 4px dotted #909090; padding: 10px; width: 500px;background:#0F192A;">CSS Border Style-dotted</div>
CSS Border Style-dashed
<div style="border: 2px dashed #909090; padding: 10px; width: 500px;background:#0F192A;">CSS Border Style-dashed</div>
CSS Border Style-inset
<div style="border: 4px inset #909090; padding: 10px; width: 500px;background:#0F192A;">CSS Border Style-inset</div>
CSS Border Style-outset
<div style="border: 4px outset #909090; padding: 10px; width: 500px;background:#0F192A;">CSS Border Style-outset</div>
CSS Border Style-ridge
<div style="border: 4px ridge #909090; padding: 10px; width: 500px;background:#0F192A;">CSS Border Style-ridge</div>
0 komentar:
Posting Komentar