La etiqueta <textarea> crea un control para edición multi-línea de texto plano. Esta etiqueta es para poner texto que se pueda modificar, enviar, o solamente que sea solo lectura sin poder modificar nada.
¿Para qué son útiles las etiquetas textarea?
El uso de las etiquetas textarea son útiles al momento de:
- ☑ Colocar un texto largo en un recuadro para así controlar el espacio que ocupa dentro de una entrada o post, esta etiqueta es para poner texto que se pueda modificar, enviar, o solamente que sea solo lectura sin poder modificarla. La ventaja es que cuando queremos poner códigos html en nuestra página web o blog y son muy largos estos códigos, podemos hacerlo del largo que nosotros queramos ya que tiene una barra para poder deslizarnos.
- ☑ Publicar un código en nuestra entrada evitando así que los navegadores lo interpreten, manipulen y/o modifiquen.
Pasos a seguir
Para utilizarlo basta con colocar el texto entre las etiquetas tal como muestra el ejemplo siguiente:<textarea name="codigo" rows="6" cols="60" readonly="">Introduzca su código aquí</textarea>
Se creará un cuadro como el siguiente:
- ☑ rows="n": Donde n es el número de filas
- ☑ cols="n": Donde n es el número de columnas
- ☑ name="nombre": Asigna un nombre identificador único al campo.
- ☑ readonly: No deja que el texto escrito en el área de texto pueda ser modificado por las personas que vean la página (sin embargo ese contenido será enviado con el resto del formulario).
- ☑ disable: Desactiva el elemento, impidiendo que el texto que contiene sea modificado, y además tampoco es enviado con el formulario.
- ☑ wrap="off / soft / hard": Se usa para indicar el texto que el texto se debe justificar (ajustar al ancho de la ventana. Off valor por defecto, no hay ajuste del texto enviándose este tal y como fue escrito. Soft, ajusta el texto a la ventana, además envía este como una cadena continua. Hard, ajusta el texto a la ventana enviando el texto como separando la palabra y líneas donde sea necesario.
También podemos utilizar un código como el siguiente:
<textarea style="height: 120px !important; width: 98% !important;">
Texto a escribir aquí
</textarea>
El cual igualmente nos creará un cuadro como el siguiente:
Ahora estila el textarea agregando el siguiente código CSS a tu style para que se vea como un cuadro:
Jorge Andres AmayaLicenciado en Economía y maestría en Administración, con amplio dominio de diversas herramientas digitales y prompts. |
