Rabu, 06 Juni 2012

Membuat Kotak Background Postingan

     Membuat Kotak Background Postingan - Beberapa waktu yang lalu ketika saya sedang browsing, secara tidak sengaja saya menemukan sebuah tutorial membuat kotak background postingan di OtoWebsite.blogspot.com. Lalu apa fungsi kotak background ini? banyak sekali, namun biasanya kotak background ini digunakan pada artikel tutorial blog, untuk menaruh script yang ada di postingan, jadi bisa terlihat lebih rapi dan terpisah dari tulisan yang lain.
      OK, berikut script dari kotak background tersebut


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

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

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

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

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

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

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

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

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

Keterangan :
- Anda bisa mengganti warna kotak background tersebut dengan warna yang anda inginkan. Anda bisa melihat Kode-Kode Warna HTML di postingan saya sebelumnya.Sebaikknya sesuaikan dengan tema di blog anda.

Selamat Mencoba

1 komentar: