Mendesign Background Chatbox part 1

Bosen dengan bentuk chatbox yang biasa-biasa aja ? Pengen di design tapi bingung caranya? Nah.. sekarang ini aku lagi pengen share tentang tutorial mendesign chatbox dengan background yang cute dan kawaii.. Postingan ini aq repost dari blognya mbak Rinda's Template. Thx yaa mbaakk ^^

Disini aq akan memberikan penjelasan yang detail tentang bagaimana membuat chatbox lebih menarik..

Langsung aja yukk, jika ada yang masih bingung silahkan bertanya dikolom komentar yaa :)

Background chatbox ini aku buat transparant dan animasi jadi bisa diterapkan dimana saja, untuk tampilan yang lebih baik bisa dipasang di template yang berwarna soft seperti putih ataupun warna lain yang mendekati putih.

<div style="background:url(http://i804.photobucket.com/albums/yy321/anik93/chatbox-animation-1-1.gif) no-repeat;padding-right:8px;padding-left:1px;padding-top:130px;padding-bottom:35px;">

(PUT YOUR CBOX CODE HERE)

</div>

Setting Kode Chatbox :

Width : 170 px || Height : 152 px (bagian awal)

Width : 170 px || Height : 75 px (bagian akhir)

Text-align: Left

<div style="background:url(http://i804.photobucket.com/albums/yy321/anik93/yellow-girl-chatbox.gif) no-repeat;padding-right:3px;padding-left:17px;padding-top:140px;padding-bottom:80px;">

(PUT YOUR CBOX CODE HERE)

</div>

Setting Kode Chatbox :

Width : 170 px || Height : 190 px (bagian awal)

Width : 170 px || Height : 75 px (bagian akhir)

Text-align: Left

<div style="background:url(http://i804.photobucket.com/albums/yy321/anik93/strawberry.gif) no-repeat;padding-right:1px;padding-left:25px;padding-top:145px;padding-bottom:70px;">

(PUT YOUR CBOX CODE HERE)

</div>

Setting Kode Chatbox :

Width : 155 px || Height : 210 px (bagian awal)

Width : 155 px || Height : 75 px (bagian akhir)

Text-align: Left