Wednesday, December 15, 2010

Making Text Area

0 comments
What is text area? It is an area or place to save the text or writing with a new area. Text area is usually used to save HTML code or the other texts so that the can be copied by the visitors.
In order to make a text are, you can copy the following code.
<p align="left">
<textarea name="code" rows="6" cols="20">   
Save Your code here 
</textarea>
</p>

for example;

Remarks;
Rows ="6", shows the height of the text area. If you want to have a high text area, you just change “6” with higher number.

Cols="20", shows the width of text area. If you want to have a wider text area, just change “20” with the other higher number.

Text Area with Highlight
There is another variation to make a text area, that is by using highlight button. With this highlight button, it will ease visitors to copy the whole text or codes given. If we click highlight button, it will automatically be highlighted and finally, just copy the highlighted codes or texts.
This facility is very useful, especially when the text or codes are a lot. To make text area with highlight, please copy the HTML below .
<div>
<form name="copy">
<div align="left">

<input onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button" value="Highlight All">
</div>
<div align="left"> </div>

<p align="left">
<textarea style="WIDTH: 300px; HEIGHT: 144px" name="txt" rows="100" wrap="VIRTUAL" cols="55">
Save Your code here 
</textarea></p>
</form>
</div>

I will explain a little about the code about to make you understand. The codes above have two elements, they are code elements which are used to make the button of Highlight All, and the second one is code elements which are used to make text area.
Button element of highlight All :
  1. <div align="left"> --> the word left shows that the button position will be in the left. If you want to make the position in the middle or right, just change “left” with center or right.
  2. <input onclick="javascript:this.form.txt.focus();this.form.txt.selec()"> --> this codes mean that when the highlight button is clicked, then all the text inside will be highlighted. So, don’t change that word or code
  3. Value="Highlight All" --> the word Highlight All is the word that will appear in the button. You can change this word with your own words.
Text area Element:
  1. <p align="left"> --> it shows that text area will be in the left. If you want to put the text area in the middle or right, just change “left” with center or right.
  2. <text style="WIDTH: 300px"> –> the word "WIDTH: 300px" shows the width of text area, that is 300 pixel. If you want to shorten or lengthen it, just change “WIDTH: 300px" pixel with, example : “WIDTH: 700px"
  3. HEIGHT: 144px --> the number "144px" shows that the height of text area will be 144 px and if you want to change it, just change that number with your own number, example HEIGHT:160px.
Good Luck!!!

0 comments:

Post a Comment

Followers

Blogumulus by Roy Tanck and Amanda Fazani
Free Blogger Tips, Hacks, Widgets, Templates and more