Text box keren untuk postingan di blogger

Membuat text box untuk postingan di blog,sangat mudah gan hanya perlu beberapa kode CSS dan HTML,untuk mengatur bentuk box dan untuk menggunakan kotak pesan tersebut pada saat kita membuat postingan,tex box ini tidak jauh berbeda dengan fungsi massage box pada blogger,sama-sama untuk meletakan kata-kata pada kotak,sehingga pembaca blog akan lebih mudah memahami maksud dari si penulis postingan,apalagi bila kita akan membuat postingan tutorial,tentunya tex box akan sangat membantu kita dalam menjelaskan atau memberikan instruksi pada pembaca blog kita,nah pada postingan saya kali ini saya akan berbagi tips atau cara membuat text box atau kotak pesan keren untuk postingan di blog,lebih jelasnya silahkan screenshot disamping,seperti itulah text box yang akan kita buat. .dengan 4 warna abu-abu,merah,kuning,hijau,oke langsung ke caranya saja sob.
Salin kode CSS di bawah ini dan pastekan tepat di atas kode ]]></b:skin> pada tempelate anda

.box {
height:auto;
margin:15px auto;
line-height:1.1 !important;
font-size:15px;
padding:5px;
width:300px;
text-align: justify;
}
.abu2 {
background:#999;
outline:4px solid #888;
outline-offset:1px;
border:2px dashed #666;
}
.merah {
background:#e00;
outline:4px solid #d00;
outline-offset:1px;
border:2px dashed #a00;
}
.kuning {
background:#FD0;
outline:4px solid #FC0;
outline-offset:1px;
border:2px dashed #FA0;
}
.hijau {
background:#0C0;
outline:4px solid #080;
outline-offset:1px;
border:2px dashed #0A0;
}

Kalau sudah memasang kode CSS di atas,sekarang save tempelate anda dan untuk menggunakan di postingan gunakan HTML di bawah ini.pastikan saat anda ingin memasukan kode HTML dibawah ini,beralih ke mode HTML dulu bukan Compose.

<div class='hijau'>

Masukan konten atau kata-kata untuk text box anda disini

</div>