Beberapa Macam Jenis "Text Area"

Berikut beberapa macam jenis Text Area :




Standard Text Area

<textarea>Totto Apa Adanya</textarea>

Text Area that can set the widht and height

<textarea cols="20" rows="5">Totto Apa Adanya</textarea>

Text Area with password style



<input type="password" value="Totto Apa Adanya" />

Text Area with dashed line

<textarea cols="20" rows="5" style="border: 2px dashed ;">Totto Apa Adanya</textarea>

Text Area with one click select all

<textarea cols="20" onclick="this.focus(); this.select();" rows="5">Totto Apa Adanya</textarea>

Text Area with select all by mouse over (no click)
<div>
<form name="catatancuss">
<div align="left" style="margin-bottom: 0pt; margin-top: 0pt;">
<textarea ;="" cols="55" name="txt" onmouseover="this.form.txt.select()" readonly="readonly" rows="100" style="height: 85px; width: 185px;">Totto Apa Adanya</textarea></div>
</form>
</div>

Text Area with Select All button
<div>
<form name="copy">
<div align="center">
<input onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button" value="Select All" /> </div>
<div align="center">
</div>
<div align="center">
<textarea cols="55" name="txt" rows="100" style="height: 85px; width: 185px;" wrap="VIRTUAL">Totto Apa Adanya</textarea></div>
</form>
</div>

Colorful Text Area

<textarea cols="20" name="code" rows="3" style="-moz-border-radius: 10px; background: #BFFAFF; border-bottom: 4px solid #40FF1F; border-left: 4px solid #FFE900; border-right: 4px solid #40FF1F; border-top: 4px solid #FFE900; color: red; line-height: 1.5em; padding: 5px;">Totto Apa Adanya</textarea>


<textarea name="code" rows="3" cols="20" style="background: #FFDAAF; color: #7F4500; border: 2px ridge #7F4500; line-height: 1.5em; padding: 5px; -moz-border-radius-topleft: 15px; -moz-border-radius-bottomright: 15px;">Totto Apa Adanya</textarea>



<textarea name="code" rows="3" cols="20" style="background:#FF000A; color:#fff; border:3px double #ffaf; line-height:1.5em; padding:5px;">Totto Apa Adanya</textarea>


<textarea name="code" rows="3" cols="20" style="background: #EF0090; color: #FFEFF9; border: 3px dotted #FFEFF9; line-height: 1.5em; padding: 5px;">Totto Apa Adanya</textarea>


<textarea name="code" rows="3" cols="20" style="background: #FBEFFF; color: #CA3DD9; border: 1px solid #CA3DD9; border-left: 20px solid #CA3DD9; line-height: 1.5em; padding: 5px; -moz-border-radius: 7px;">Totto Apa Adanya</textarea>

2 comments

  1. Bagus sekali tutorialnya sob, nice post :)

    ReplyDelete
  2. @Farixsan Quilicuor (Faris Hardiyanto 177) :
    makasih, sob. silahkan dicoba !

    ReplyDelete

RANK

FRIENDS