10.22.2011
Cara Memodifikasi Textarea
Satu lagi modifikasi yang sangat sepektakuler, siapa lagi orangnya kalau bukan si Education For All Textarea bukan sebuah box sederhana saja yang sekedar tampil apa adanya untuk wadah link exchange, banner exchange atau kode html dan teks yang lain. Dengan sedikit polesan berupa kode CSS dan CSS3, tak seorangpun akan menduga bahwa yang mereka lihat adalah sebuah textarea. Sobat blogger mania dapat menggunakan textarea penuh gaya ini di blog untuk wadah baru yang tampil luar biasa.
Menghilangkan border bawaan yang berupa warna border dan tebal border, serta menghilangkan outline menjadi kunci hingga textarea menampilkan diri dalam perwujudan yang berbeda. Tentu saja itu tak cukup. Kode CSS dan CSS3 menejadi baju baru yang menjadikan textarea seakan baru keluar dari salon dengan dandanan yang serba"wah" dan penampilan "elegan, manis, cantik sekaligus macho!".
Kita akan gunakan CSS3 border-radius, CSS3 drop shadow (box shadow), CSS3 text-shadow, CSS3 text-shadow, CSS3 Transition serta beberapa kode CSS seperti margin, padding, border dan outline. Mengapa kita gunakan "outline"?
Outline: none; berfungsi untuk melenyapkan border yang muncul ketika bagian di textarea "di klik", baik untuk copy code ataupun sekedar sebuah "klik" tak sengaja. Tanpa menghilangkaan "outline" tentu saja bagi beberapa yang tahu kode html akan segera sadar bahwa apa yang di hadapannya adalah sebuah textarea. Sampeyan bisa tambahkan atau rubah beberapa kode CSS yang disertakan di sini bila ingin membuat textarea ini tampil dengan gaya yang berbeda. bila sobat blogger mania ingin memperagakanya silahkan ikuti langkah langkah berikut ini
* Login to blogger.
* KLIK link "Design (Rancangan)".
* KLIK link "Edit HTML".
* Cari kode ]]> .
* Copy dan patekan kode CSS textarea di atas kode ]]>.
* KLIK "SAVE Templates (Simpan Template)".
* Lanjutkan dengan cara menggunakan xHTML textarea.
* Bila belum jelas urutan dan cara melakukan penyimpanan kode, buka "Special Tutorials" yang di dalamnya terdapat tutorial cara cepat cari kode HTML dan Cara lengkap melakukan penyimpanan kode CSS, xHTML, Javascript di blog (template).
Kode CSS Text Area
Cara Menggunakan Text Area
Gunakan kode HTML berikut saat digunakan di halaman posting atau melalui "Add Gadget".
Satu lagi modifikasi yang sangat sepektakuler, siapa lagi orangnya kalau bukan si Education For All Textarea bukan sebuah box sederhana saja yang sekedar tampil apa adanya untuk wadah link exchange, banner exchange atau kode html dan teks yang lain. Dengan sedikit polesan berupa kode CSS dan CSS3, tak seorangpun akan menduga bahwa yang mereka lihat adalah sebuah textarea. Sobat blogger mania dapat menggunakan textarea penuh gaya ini di blog untuk wadah baru yang tampil luar biasa.
Menghilangkan border bawaan yang berupa warna border dan tebal border, serta menghilangkan outline menjadi kunci hingga textarea menampilkan diri dalam perwujudan yang berbeda. Tentu saja itu tak cukup. Kode CSS dan CSS3 menejadi baju baru yang menjadikan textarea seakan baru keluar dari salon dengan dandanan yang serba"wah" dan penampilan "elegan, manis, cantik sekaligus macho!".
Kita akan gunakan CSS3 border-radius, CSS3 drop shadow (box shadow), CSS3 text-shadow, CSS3 text-shadow, CSS3 Transition serta beberapa kode CSS seperti margin, padding, border dan outline. Mengapa kita gunakan "outline"?
Outline: none; berfungsi untuk melenyapkan border yang muncul ketika bagian di textarea "di klik", baik untuk copy code ataupun sekedar sebuah "klik" tak sengaja. Tanpa menghilangkaan "outline" tentu saja bagi beberapa yang tahu kode html akan segera sadar bahwa apa yang di hadapannya adalah sebuah textarea. Sampeyan bisa tambahkan atau rubah beberapa kode CSS yang disertakan di sini bila ingin membuat textarea ini tampil dengan gaya yang berbeda. bila sobat blogger mania ingin memperagakanya silahkan ikuti langkah langkah berikut ini
* Login to blogger.
* KLIK link "Design (Rancangan)".
* KLIK link "Edit HTML".
* Cari kode ]]> .
* Copy dan patekan kode CSS textarea di atas kode ]]>.
* KLIK "SAVE Templates (Simpan Template)".
* Lanjutkan dengan cara menggunakan xHTML textarea.
* Bila belum jelas urutan dan cara melakukan penyimpanan kode, buka "Special Tutorials" yang di dalamnya terdapat tutorial cara cepat cari kode HTML dan Cara lengkap melakukan penyimpanan kode CSS, xHTML, Javascript di blog (template).
Kode CSS Text Area
Cara Menggunakan Text Area
Gunakan kode HTML berikut saat digunakan di halaman posting atau melalui "Add Gadget".
