Membuat Berbagai Macam Kotak Backround di Blog

Kali ini Saya mau berbagi cara membuat berbagai macam kotak background di posting blog, jika kalian ingin menampilkan kotak background di dalam postingan atau halaman baru kalian.
Sebagai contoh kotak backround Dashed :

CONTOH KOTAK BACKROUND DASHED <CODE>

Dalam kotak background bisa di isi dengan tulisan atau kode HTML/SCRIPT yang sudah di parse terlebih dahulu agar bisa muncul di dalam kotak background.
Langsung aja di praktekkan yukz :)


Dotted

< div style="border: 2px #F1960E dotted; padding: 10px; background-color: #000000; text-align: left;">KODE/TEKS</div>

Dashed

< div style="border: 2px #F1960E dashed; padding: 10px; background-color: #000000; text-align: left;">KODE/TEKS</div>

Double

< div style="border: 2px #F1960E double; padding: 10px; background-color: #000000; text-align: left;"> KODE/TEKS</div>

Grove

< div style="border: 4px #F1960E groove; padding: 10px; background-color: #000000; text-align: left;">KODE/TEKS</div>

Solid

< div style="border: 2px #F1960E solid; padding: 10px; background-color: #000000; text-align: left;"> KODE/TEKS</div>

Outset

< div style="border: 4px #F1960E outset; padding: 10px; background-color: #000000; text-align: left;">KODE/TEKS</div>

Insert

< div style="border: 4px #F1960E inset; padding: 10px; background-color: #000000; text-align: left;">KODE/TEKS</div>

Ridge

< div style="border: 2px #F1960E ridge; padding: 10px; background-color: #000000; text-align: left;">KODE/TEKS</div>

Scroll

< div style="border: 4px #F1960E solid; padding: 10px; background-color: #000000; overflow: auto; height: 50px; width: 300px; text-align: left;">KODE/TEKS</div>

Catatan:
border = warna bagian samping.
background = warna bagian tengah.