Membuat Text Area

AksFullShare-Kali ini saya ingin berbagi tentang cara membuat text area dengan HTML, meskipun sederhana, saya mencoba mengabadikan ilmu ini agar tidak terlupakan dan bisa bermanfaat buat yang belum tahu mengenai info ini.... berikut langkah membuat Text area sederhana...

1. Teks Area Pertama

Adalah teks area yang paling simpel  alias sederhana...

Berikut Kodenya :

<textarea>Masukkan Kode/Tulisan Yang Anda Inginkan</textarea>

Hasilnya Akan Seperti Ini :
Masukkan Kode/Tulisan Yang Anda Inginkan

2. Teks Area Ke-dua

Adalah Teks area yang bisa kita atur Panjang dan Lebarnya..

Berikut Kodenya :

<textarea cols="25" rows="4">Masukkan Kode/Tulisan Yang Anda Inginkan</textarea>

Hasilnya Akan Seperti Ini :
Masukkan Kode/Tulisan Yang Anda Inginkan

3. Teks Area Ke-Tiga

Adalah Teks Area yang garisnya terputus-putus

Berikut Kodenya :

<textarea cols="25" rows="4" style="border: 2px dashed ;">Masukkan Kode/Tulisan Yang Anda Inginkan</textarea>

Hasilnya Akan Seperti Ini :
Masukkan Kode/Tulisan Yang Anda Inginkan

4. Teks Area Ke-Empat

Adalah Teks area auto block, artinya jika teks kita klik akan otomatis ke blok semua.

Berikut Kodenya :

<textarea cols="25" rows="4" onclick="this.focus(); this.select();">Masukkan Kode/Tulisan Yang Anda Inginkan</textarea>

Hasilnya Akan Seperti Ini :
Masukkan Kode/Tulisan Yang Anda Inginkan (Coba Klik, Tulisannya akan Keblok)

5. Teks Area Ke-Lima

Adalah Teks area dengan Tombol select all di atas dan di bawah

Berikut Kode Select all di Atas :

<div><formname="copy"><div align="center"><inputonclick="javascript:this.form.txt.focus();this.form.txt.select();"type="button" value="Select All"> </div><divalign="center"></div><p align="center"><textareastyle="widht: 300px; height: 144px" name="txt" rows="100"wrap="virtual" cols="55">Masukkan Kode/Tulisan Yang Anda Inginkan</textarea></p></div></form>

Hasilnya Akan Seperti Ini :

Masukkan Kode/Tulisan Yang Anda Inginkan

Berikut Kode Select all di Bawah :

<form name="copy"><div style="text-align: center;"><textarea style="padding: 3px; width: 300px; height: 50px;" name="txt">Masukkan Kode/Tulisan Yang Anda Inginkan</textarea></div><p align="center"><input value="Select All" onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button"/></p></form>

Hasilnya Akan Seperti Ini :

Masukkan Kode/Tulisan Yang Anda Inginkan

Keterangan :

Width  : Lebar
Height : Tinggi
Cols     : kolom
Rows   : Baris
Border : Garis

Semoga Bermanfaat Buat Anda juga....

Sumber : AksFullShare