+==xXx(EXPLORATION)=xXx==+=

Home » Tips Blogger » Membuat Textarea Dengan Tampilan Menarik

Membuat Textarea Dengan Tampilan Menarik

Caranya adalah sebagai berikut :

1. Login ke Akun Blogger anda masing-masing.
2. Klik Design or Rancangan, kemudian pilih Edit HTML
3. Centang (Expand Widget Template)
4. Untuk keamanan lebih baik kita (Download Template Lengkap)
5. Gunakan (Ctrl+F) or (Alt+E+F) untuk memudahkan pencarian
6. Cari kode ]]></b:skin>
7. Dan Simpan kode berikut diatasnya :

/* Textarea CSS#
----------------------------------------------- */
textarea.css3area {
background:-moz-linear-gradient(left, #051547, #253dee, #051547, #253dee, #051547);
border: 0px solid transparent;outline: none;
border: 5px solid;
border-color: #051547 #999 #999 #051547;
border-radius: 12px;
-moz-border-radius: 12px;
-webkit-border-radius: 12px;
box-shadow: -1px -1px 1px #533801, 1px 1px 1px #533801, 1px 1px 10px #555;
-moz-box-shadow:
-1px -1px 1px #533801, 1px 1px 1px #533801, 1px 1px 10px #555;-webkit-box-shadow: -1px -1px 1px #533801, 1px 1px 1px #533801, 1px 1px 10px #555;
-moz-transition: all 1s ease-out;
-webkit-transition: all 1s ease-out;
padding: 5px 5px 2px;
margin: 20px 10px;-o-transition: all 1s ease-out;
height:200px;
width: auto;
margin-right: 5px;
color: #fff;
}
textarea.css3area:hover {
background:-moz-linear-gradient(left, #253dee, #051547, #253dee, #051547, #253dee);
border-color: #999 #888 #888 #999;
border-radius: 8px;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
text-shadow: 1px 1px 1px #aaa;
color: #fff;
box-shadow: -1px -1px 1px #533801, 1px 1px 1px #533801, 1px 1px 20px #222;
-moz-box-shadow: -1px -1px 1px #533801, 1px 1px 1px #533801, 1px 1px 20px #222;
-webkit-box-shadow: -1px -1px 1px #533801, 1px 1px 1px #533801, 1px 1px 20px #222;
height:200px;
width: auto;

}

8. Cara penggunaan

<textarea class="css3area" cols="60" row="90">Masukkan teks nya disini .........Masukkan teks nya disini ......Masukkan teks nya disini .........Masukkan teks nya disini... </textarea>