How to Create a Multi-line Text Input (Text Area) In HTML?


To create a multi-line text input, use the HTML <textarea> tag. You can set the size of a text area using the cols and rows attributes. It is used within a form, to allow users to input text over multiple rows.

Here are the attributes of <textarea> tag −

AttributeValueDescription
autofocusautofocusSpecifies that on page load the text area should automatically get focus.
ColsnumberSpecifies the width of the textarea based on the number of visible character widths.
DisableddisabledSpecifies the width of the textarea based on the number of visible character widths.
formform_idSpecifies one or more forms.
maxlengthnumberSpecifies the maximum number of characters in textarea.
NametextAssigns a name to the input control.
placeholdertextSpecifies a short hint of the value in textarea.
ReadonlyreadonlySets the input control to read-only. It won't allow the user to change the value. The control however, can receive focus and are included when tabbing through the form controls.
requiredrequiredSpecifies that a textarea is required.
RowsnumberSpecifies the height of the textarea based on the number of visible lines of text. If there's more text than this allows, users can scroll using the textarea's scrollbars.
wraphardsoftSpecifies the text to be wrapped in textarea.

Example

You can try to run the following code to create a multi-line text input in HTML −

<!DOCTYPE html>
<html>
   <head>
      <title>HTML textarea Tag</title>
   </head>

   <body>
      <form action = "/cgi-bin/hello_get.cgi" method = "get">
         What improvements you want in College?
         <br>
         <textarea rows = "5" cols = "60" name = "description">
            Enter details here...
         </textarea><br>
         <input type = "submit" value = "submit" />
      </form>
   </body>
</html>

Updated on: 02-Sep-2023

46K+ Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements