HTML textarea

La etiqueta <textarea> en HTML5 es utilizada para crear un área de texto multilínea en un formulario web. El texto ingresado en el área de texto puede ser enviado a un script del servidor para su procesamiento.

La etiqueta <textarea> debe ser utilizada junto con la etiqueta de formulario <form>, y se puede especificar el número de filas y columnas que desea que tenga el área de texto mediante el uso de los atributos rows y cols.

También se puede especificar un valor predeterminado para el área de texto mediante el uso del atributo value.

Ejemplo de uso

Aquí tienes un ejemplo de cómo se utiliza la etiqueta <textarea> en HTML:

<form>
    <textarea rows="4" cols="50">
    Este es un ejemplo de área de texto multilínea.
    </textarea>
</form>

Lenguaje del código: HTML, XML (xml)

Además, también se puede utilizar los atributos maxlength para limitar el número de caracteres que se pueden ingresar y el placeholder como una indicación para el usuario de qué debe escribir en ese espacio.

Atributos

La etiqueta <textarea> de HTML5 tiene varios atributos que se pueden utilizar para personalizar su apariencia y comportamiento:

• autofocus: Especifica que el área de texto debe tener el foco automáticamente cuando la página carga.

• cols: Especifica el número de columnas que se deben mostrar en el área de texto.

• disabled: Especifica que el área de texto está deshabilitada y el usuario no puede interactuar con ella.

• form: Especifica el formulario al que pertenece el área de texto.

• maxlength: Especifica el número máximo de caracteres que se pueden ingresar en el área de texto.

• name: Especifica el nombre del área de texto. Este nombre es utilizado para identificar el área de texto cuando se envía el formulario.

• placeholder: Especifica un texto de ejemplo que se muestra en el área de texto antes de que el usuario ingrese algún valor.

• readonly: Especifica que el área de texto es de solo lectura y el usuario no puede ingresar texto.

• required: Especifica que el usuario debe ingresar un valor en el área de texto antes de enviar el formulario.

• rows: Especifica el número de filas que se deben mostrar en el área de texto.

• wrap: Especifica cómo se deben manejar los saltos de línea en el área de texto. Los valores posibles son “hard”, “soft” y “off”.

Además de estos, también se pueden utilizar atributos estándar como class, id, style y title para dar estilo y describir el textarea.

Más ejemplos

Aquí te dejo un ejemplo de cómo utilizar varios de los atributos de la etiqueta <textarea> de HTML5 en un formulario:

<form>
    <label for="feedback">Deja tu comentario:</label>
    <textarea id="feedback" name="feedback" rows="5" cols="30" maxlength="250" required placeholder="Ingresa tu comentario aquí"></textarea>
    <br>
    <input type="submit" value="Enviar">
</form>

Lenguaje del código: HTML, XML (xml)

En este ejemplo se utilizan los atributos rows, cols, maxlength y required para especificar el tamaño y la validación del área de texto. El atributo placeholder es usado para proporcionar una indicación al usuario sobre qué debe ingresar en el área de texto.

Además, se usa el atributo name para identificar el área de texto cuando se envía el formulario y el id junto con el atributo for del label para vincularlo con el label, permitiendo una mejor accesibilidad.

Cabe mencionar que el atributo name es importante, ya que es el valor que se utilizará para identificar el campo en la petición del formulario y el atributo id es utilizado para hacer referencia al campo mediante CSS y JavaScript.