Text input boxes should be used in general message books, forums, etc. That is, textarea and textare in the html language contain many parameters. If you learn to use these parameters, you can modify the size and appearance of the text input box at will to achieve the effect you want. Here are the parameters and how to use these parameters.
1. Cols, vertical column. Without stylesheet settings, it represents the number of bytes that can be accommodated in a row. For example, cols=60 means that a line can accommodate up to 60 bytes, that is, 30 Chinese characters. In addition, it is important to note that the width of the text box is adjusted through this, enter the cols value, and then define the size of the input text font (if it is not defined, the default value will be used), then the width of the text box will be determined.
2. rows, horizontal column. Indicates the number of rows that can be displayed, such as rows=10, which means that 10 rows can be displayed. If you have more than 10 lines, you need to drag the scrollbar to browse. (Same as above, the height of the text box is controlled through this.)
3. Name, the name of the text box, this item is indispensable because it must be used when storing text.
4. warp. When warp=off means that there is no automatic wrapping in the text area, of course, if you do not write, it will be automatic wrapping by default. This parameter is generally used less frequently.
5. Style, this is a very practical parameter, which can be used to set the background color of the text box, the scroll bar color and form, the border color, the input font size and color, etc.
6. class, generally used to call settings in external css.
Example 1: Set the number of rows in the text box to 40 and the number of columns to 10. Name is text. Expression form <textarea cols=40 rows=10 name=text></textarea>
Example 2: Cancel the scroll bar on the right side of the text box. Expression form <textarea cols=40 rows=10 name=text style=overflow:auto></textarea>. style=overflow:auto means that the scroll bar will be automatically displayed when the input text exceeds the set number of lines.
Example 3: Set the background color of the text box. <textarea cols=40 rows=10 name=text style=background-color:BFCEDC></textarea>.
Example 4: In addition, set the scroll bar color, border color, font size, color, line spacing, etc. of the text box, which can be set directly in style. However, these are usually used to setting them in CSS, just call them directly. Below is a CSS setting code: it should be easier to understand. The textbox is set in sequence with the background color of the text box, the color and thickness of the upper, lower, left and right border color and thickness, as well as the size of the input font.
| <style> .textbox { BACKGROUND: #BFCEDC; BORDER-TOP: #7F9DB9 1px solid; BORDER-LEFT: #7F9DB9 1px solid; BORDER-RIGHT: #7F9DB9 1px solid; BORDER-BOTTOM: #7F9DB9 1px solid; FONT-FAMILY: Songti, Verdana, Arial, Helvetica; FONT-SIZE: 12px; TEXT-ALIGN: LIFT;} </style> |
Insert the above code between <head> and </head> of the page. Call method: <textarea cols=40 rows=10 name=text class=textbox></textarea>. The name in class= corresponds to the name of the setting to be used in css. Once you are familiar with these parameters, it is very convenient to modify and beautify the text input box.