¿Cómo establecer el tamaño del área de texto en HTML?

En este artículo, discutiremos cómo establecer el tamaño del área de texto en HTML. La etiqueta <textarea> en HTML define un control de edición de texto sin formato de varias líneas. Un espacio de texto contendrá una variedad infinita de caracteres y, por lo tanto, el texto se representa en una fuente de ancho establecido (generalmente Courier)

Sintaxis :

<textarea>.........</textarea>

Podemos establecer el tamaño del área de texto usando filas y columnas. filas*columnas será el tamaño del área de texto.

  • Para las columnas, tenemos que usar la palabra clave cols . Se utiliza para decirle al navegador cuántos caracteres de ancho promedio deben caber en una sola línea, es decir, el número de columnas que se mostrarán.
  • Para las filas, tenemos que usar la palabra clave filas . Se utiliza para especificar el número de líneas de texto visibles para el control, es decir, el número de filas que se mostrarán.

Ejemplo 1: En este ejemplo, vamos a crear un área de texto con 4 filas y 7 columnas

HTML

<!DOCTYPE html>
<html>
<head>
    <title>textarea tag</title>
</head>
  
<body>
    <h1 style="color:green">GeeksforGeeks</h1>
    <h2>HTML Textarea tag </h2>
    <form action="#">
        <textarea rows="4" cols="7"    name="blog">
          Hi Geek
        </textarea>
        <br>
        <input type="submit" value="submit">
    </form>
</body>
</html>

Producción:

Ejemplo 2: En este ejemplo, vamos a crear un área de texto con 10 filas y 20 columnas.

HTML

<!DOCTYPE html>
<html>
<head>
    <title>textarea tag</title>
</head>
  
<body>
    <h1 style="color:green">GeeksforGeeks</h1>
    <h2>HTML Textarea tag </h2>
    <form action="#">
        <textarea rows="10"    cols="20" name="blog">
          Hi Geek        
        </textarea>
        <br>
        <input type="submit" value="submit">
    </form>
</body>
</html>

Producción:

Publicación traducida automáticamente

Artículo escrito por sravankumar8128 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *