Tips & Trik Membuat Kotak Kode / Text Area

Wrote by Post Comment

Hellow, sobat bloggers. Di sesi kali ini ane akan share tentang Tips & Trik Membuat Kotak Kode / Text Area. Maksudnya menghias text area? Pasti kata-kata itu yg ada di benak sobat bloggers saat ini. Fungsi text area adalah untuk meletakkan sebuah kode pada artikel, biasanya kita memakai sebuah text area yg berbentuk formal, meskipun Kaka-jR jarang menggunakan area jenis ini (ribet, hehehe..).

Contoh text area polos seperti ini :

dengan kode seperti ini :
<form name="contohtextarea"><textarea name="txt" rows="3" cols="30" readonly>Text sobat Disini</textarea></form>
**rows dan cols menentukan ukuran text area,disitu anda edit sesuai keinginan anda.
Tapi jika sobat menginginkan sebuah form area kode yang berbeda, bisa dicoba contoh-contoh text area di bawah ini:

Text Area Contoh #1

Text area di atas:
  • Background berwarna kuning
  • Border berwarna biru (dot)
  • Warna Text Merah
  • Text bergaris bawah
Untuk kodenya copy kode di bawah ini :
<form><textarea rows="3" cols="30" background-color="green"
style="color: red; background-color: yellow; text-decoration: underline; border-style: dotted; border-color: blue">Text Anda Disini</textarea></form>

Text Area Contoh #2

Text area di atas:
  • Background berwarna Hijau
  • Border berwarna Kuning (solid)
  • Text Huruf Besar (Uppercase)
  • Warna Text Putih
Untuk kodenya copy kode di bawah ini :
<form><textarea rows="3" cols="30" style="color: white; background-color: green; text-transform: uppercase; border-style: solid; border-color: yellow">Text Anda Disini</textarea></form>

Text Area Contoh #3

Text area di atas:
  • Background berwarna Biru
  • Border berwarna Merah (solid)
  • Text Tanpa bergaris bawah
  • Warna Text Kuning
Untuk kodenya copy kode di bawah ini :
<form><textarea rows="3" cols="30" style="color: yellow; background-color: blue; border-style: solid; border-color: red" >Text Anda Disini</textarea></form>

Text Area Contoh #4

Text area di atas:
  • Background berwarna Hijau
  • Border berwarna gray/abu-abu(solid)
  • Warna text Putih dan berhuruf tebal
  • Kode terinstall/terblok otomatis
Untuk kodenya copy kode di bawah ini :
<form name="contohtextarea"><textarea name="txt" rows="3" cols="30" onmouseover="this.form.txt.select()" readonly ; style="color: white; background-color: green; font-weight: bold; border-color:gray">Text Anda Disini</textarea></form>
Untuk jenis-jenis yang lain bisa sobat modif sendiri, gampang kan?
Semoga bermanfaat buat sobat bloggers & selamat mencoba ya:)

Tags:

Share:

0 comments