membuat text area dengn CSS

Text area digunakan jika kita ingin memposting tulisan yang banyak atau rumit, contohnya koding HTML , PHP,  CSS dan lainnya. ini sangat membantu sekali, perhatikan contoh  text area dibawah ini dan ikuti cara membuatnya langkah-demi langkah:

textarea.box{ font-size: 14px; font-family: Arial, Tahoma, Helvetica; border: 0px solid transparent; outline: none; border: 5px solid; border-color: #ccc #aaa #aaa #ccc; border-radius: 12px; -moz-border-radius: 12px; -webkit-border-radius: 12px; background: #eee; 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; text-shadow: 1px 1px 1px #666; padding: 5px 5px 2px; color: #625F3C; margin: 15px 5px; -o-transition: all 1s ease-out; -moz-transition: all 1s ease-out; -webkit-transition: all 1s ease-out; } textarea.box:hover { border-color: #aaa #888 #888 #aaa; border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px; background: #fff; color: #111; text-shadow: 1px 1px 1px #aaa; 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; }

1. 1. Login ke Blog Anda
2. 2. Pilih DESIGN dan klik EDIT HTML 
3. Akan tampil coding HTML, cari  koding ]]></b:skin> ( tekan F3,  copy-paste koding warna merah ).
4. Copykan semua koding  css yang ada di text area   diposisi DIATAS ]]></b:skin> 
5. Simpan Template. Bagaimana cara menggunakan css yang telah kita masukkan ke dalam templater, tuliskan koding  berikut dipostingan anda, maka akan terbentuk text area.

     <textarea class="box" rows="6" cols="60">
      Tuliskan Teks atau Kode HTML / css / yang lain di sini !
     </textarea>

Jika ingin berubah lebar  textarea cols="60" , jika ingin berubah  tinggi textarea rows="6" semakin besar nilainya akan diperoleh textbox yang besar juga. Selamat mencoba. 

Lihat Artikel TOP Terkait:

Posted in: Tutorial Blog