Cara Membuat Text Area

Tutorial | Text Area adalah sebuah kotak untuk menampilkan teks berupa kode ataupun hanya teks biasa, untuk mempermudah teks/kode yang akan sobat salin.

Membuat Text Area ada beberapa macam seperti berikut ini :

1. Text Area Default

Text Area Default

Kodenya :

<div style="text-align: center;"> <textarea> Text Area Default</textarea> </div>

2. Text Area Bila di Klik Akan Terblok Semua

Text Area Bila di Klik Akan Terblok Semua

Kodenya :

<div style="text-align: center;"> <textarea style="display: inline;" onclick="this.focus();this.select()">Text Area Bila di Klik Akan Terblok Semua</textarea> </div>

3. Text Area Bila Mouse Melintas Akan Terblok Semua

Text Area Bila Mouse Melintas Akan Terblok Semua

Kodenya :

<div style="text-align: center;"> <textarea onclick="this.focus();this.select()" onfocus="this.select()" onmouseover="this.focus()" style="display: inline;"> Text Area Bila Mouse Melintas Akan Terblok Semua </textarea> </div>

4. Text Area Dengan Tombol

Text Area Dengan Tombol

<form name="copy"> <div align="center"> <input onclick="javascript:this.form.text.focus();this.form.text.select();" type="button" value="Copy All" /></div> <div align="center"> <textarea name="text" wrap="VIRTUAL">Text Area Dengan Tombol</textarea></div> </form>

5. Pengaturan Text Area

Pengaturan Text Area lebar, panjang dan background

Kodenya :

<div style="text-align: center;"> <textarea cols="30"  rows="3"  style="background: #E0FFFF; display: inline;">Pengaturan Text Area lebar, panjang dan background</textarea></div>

Keterangan :
a. Yang berwarna Biru untuk mengatur posisi
b. Yang berwarna Pink untuk mengatur kolom text area
c. Yang berwarna Hijau untukmengatur baris text area
d. Yang berwarna Orange untuk mengatur warna background
e. Yang berwarna Merah Teks/kode yang akan ditampilkan

 

sekian aja ya sahabat Blogger Tutorial, semoga Bermanfaat :)