Cara Membuat Text Area

Mengawali perjumpaan kita kali ini,sengaja saya posting Cara Membuat Text Area di Blog dengan beberapa Macam bentuk atau code yang berbeda.telah kita ketauhi Text Arae adalah suatu area atau tempat yang biasa digunakan untuk menyimpan suatu text atau kode HTML.hampir sama dengan kolom scroll yang fungsi nya sama-sama untuk menghemat tempat baik di postingan maupun di dalam widget HTML.tanpa panjang x lebar mari kita lihat beberapa macam bentuk Text Area berikut dengan code nya di bawah ini.

1.textarea biasa

Kodenya di bawah ini
<#textarea cols="30" rows="5">isi textnya disini<#/textarea>
Hapus tanda # pada script

2.textarea dengan background dan teks berwarna

Kodenya di bawah ini
<#textarea cols="30" name="code" rows="5" style="background: black; border-left: 20px solid #CA3DD9; border: 3px; color: Magenta; line-height: 1.5em; padding: 5px;">isi textnya disini<#/textarea>
Hapus tanda # pada script

3.textarea dengan border

Kodenya di bawah ini
<#textarea cols="20" rows="5" style="border: 2px dashed; height: 80px; width: 429px;">isi textnya disini<#/textarea>
Hapus tanda # pada script

4.textarea dengan warna border

Kodenya di bawah ini
<#textarea style="width: 300px;height:60px; border:1px solid red;" readonly="readonly">isi tektnya disini<#/textarea>
Hapus tanda # pada script

5.Textarea dengan tombol pilih semua
Kodenya di bawah ini
<#form name="copy"><div align="center"><input value="pilih semua" onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button"/></div><p style="text-align: center;"><textarea style="padding: 3px; width: 300px; height: 50px;" name="txt">isi textnya disini</textarea></p><#/form>
Hapus tanda # pada script

6.Text Area terblok Semua saat Dibayangi oleh Mouse
Kodenya di bawah ini
<div>
<form name="Jenius Blog">
<div align="center" style="margin-bottom: 0pt; margin-top: 0pt;">
<textarea ;="" cols="55" name="txt" onmouseover="this.form.txt.select()" rows="100" style="height: 50px; width: 300px;">Text Area terblok Semua saat Dibayangi oleh Mouse</textarea></div>
</form>
</div>

7.Text Area Yang Tidak Bisa Dihapus
Kodenya di bawah ini
<div align="center">
<textarea rows="2" cols="35" onclick="this.focus(); this.select();" readonly="">tulis textnya di sini</textarea></div>

8.Textarea dengan style garis tepi dan background warna

Kodenya di bawah ini
<textarea align="center" style="background-color: #FF0000; border-radius: 7px 7px 7px 7px; border: 1px solid rgb(204, 204, 204); height: 70px; width: 300px;">Textarea dengan style garis tepi dan background warna</textarea>

9.Textarea dengan background warna tanpa border

Kodenya di bawah ini
<textarea align="center" style="background-color: #FF0000; height: 70px; width: 300px;">Textarea dengan background warna tanpa border </textarea>

10.textarea warna-warni

Kodenya di bawah ini
<textarea name="code" rows="3" cols="20" style="background:Darkorange;color:#FF0000;border-bottom:4px solid Green;border-right:4px solid Darkblue;border-top:4px solid Cyan;border-left:4px solid Red;line-height:1.5em;padding:5px;">isi textnya disini</textarea>


Selanjutnya silahkan sobat berkreasi sendiri sesuai dengan kesukaan masing-masing,semoga berhasil salam blogger.







Tidak ada komentar:

Posting Komentar