css nama - nama / model border

sebelum kita membahas nama - nama atau model pada border yang tentunya untuk keperluan aturan css anda , ada baiknya bila anda tahu Apa itu border ? ,,mungkin sebagian dari anda sudah tahu mengenai border ini , tapi gk papa akan saya jelasin tentang border ini , border itu adalah garis tepi atau garis pembatas Elemen . border ini biasanya di pakai untuk pelengkap sekaligus sebagai pembatas elemen - elemen yang ada di blog anda . berikut ini adalah nama - nama / model border pada css :

Model Border	keterangan
solid	untuk membuat boder / 1 garis lurus
double	untuk membuat 2 garis lurus
dotted	untuk membuat garis putus - putus ( kotak )
dashed	membuat garis putus - putus ( segi panjang )
inset	elemen seperti di luar
outset	elemen seperti di dalam
ridge	hampir sama dengan inset
groove	hampir sama juga dengan outset

NOTE : untuk mengatur tebal border gunakan nilai px ( pixel )contoh :

{border:2px solid;}
untuk mengatur wrna pada border gunakan nama warna atau hex color ada di sini contoh :

{border:2px solid black;}
atau

{border:2px solid#000;}
solid adalah model dari border tersebut .
contoh border solid

di sini tulisan di dalam border solid di sini tulisan di dalam border solid di sini tulisan di dalam border solid di sini tulisan di dalam border solid

dan hasil di atas sebagai berikut :

<style>.borderSolid{width:90%;margin:0;padding:10px;border:2px solid black;font-size:12px;color:black;}</style>
<div class="borderSolid">
di sini tulisan di dalam border solid di sini tulisan di dalam border solid di sini tulisan di dalam border solid di sini tulisan di dalam border solid</div>

contoh : border dotted

di sini tulisan di dalam border dotted di sini tulisan di dalam border dotted di sini tulisan di dalam border dotted

dan kode di atas sebagai berikut :

<style>
.borderDotted{width:90%;margin:0;padding:10px;border:2px dotted black;font-size:12px;color:black;}
</style>
<div class="borderDotted">
di sini tulisan di dalam border dotted di sini tulisan di dalam border dotted di sini tulisan di dalam border dotted
</div>

contoh : border dashed

di sini tulisan di dalam border dashed di sini tulisan di dalam border dashed di sini tulisan di dalam border dashed

dan Selanjutnya anda bisa berkreasi sendiri
sampai di sini tutorial nya selesai . dan semoga artikel nama - nama / model border ini bermanfaat .