Resumen

El elemento HTML <textarea> representa un control para edición muti-línea de texto plano.

Contenido de Uso

Content categories Flow content, phrasing content, Interactive content, listed, labelable, resettable, y submittable form-associated elemento
Contenido Permitido Datos carácter
Omisión de etiquetas None, both the starting and ending tag are mandatory.
Elementos padre permitidos Cualquier elemento que soporta phrasing content.
Interfaz Dom HTMLTextAreaElement

Atributos

Este elemento contiene  global attributes.

autocapitalize
Este es un atributo no estándar usado por iOS Safari Mobile ( y otro navegadores que usan WebKit en iOS, incluyendo Firefox para iOS) que controlan si el texto debe ser puesto automáticamente en mayúsculas mientras en insertado / editado por el usuario. Los valores no depreciados están disponible en la versión 5 de iOs y en versiones superiores. Los valores posibles son:
  • none: Deshabilitia la capitalización automática
  • sentences:  Automáticamente escribe con mayúscula la primera letra de cada frase.
  • words: Automáticamente escribe con mayúsculas la primera letra de las palabras.
  • characters: Automáticamente escribe con mayúscula todos los caracteres.
  • on: Depreciado desde la versión 5 de iOS.
  • off: Depreciado desde la versión 5 de iOS.
autocomplete HTML5
Este atributo indica si el valor del control puede ser completado automáticamente por el navegador. Los posibles valores son:
  • off: El usuario debe explícitamente introducir el valor del campo para cada uso, o el documento proporciona su propio método de auto-completado; el navegador no completa automáticamente.
  • on: El navegador puede completar automáticamente el valor basándose en valores que el usuario haya insertado durante usos previos.

Si el atributo autocomplete no está definidio en el elemento textarea, entonces  el navegador usa el valor del atributo autocomplete del propietario del elemento <textarea> . El propietario del formulario es o bien el elemento form del cual el <textarea> es descendiente o el elemento form cuyo id está especificado en el atributo form del elemento. Para más información, ver  el atributo autocomplete en <form>.

autofocus HTML5
Este atributo booleano te permite especificar que un control de un formulario adquiera el foco cuando se carga la página, salvo que el usuario anule esto , por ejemplo tecleando en un control diferente. Sólo se puede especificar este atributo en los elementos asociados a formularios.
cols
La anchura visible del control de texto, en caracteres de anchura media. Si está definido debe ser positivo. Si no, por defecto, el valor es 20 (HTML 5).
disabled
Este atributo booleano indica que el usuario no puede interactuar con el control. Si el atributo no está definido se hereda su valor del elemento en el que está contenido, por ejemplo <fieldset>; Si no está dentro de un elemento contenedor con el atributo disable establecido, entonces el control estará habilitado.
form HTML5
El formulario al cual el elemento textarea está asociado (el propietario del formulario). El valor del atributo debe ser un ID de un elemento formulario del mismo documento. Si no se especifica este atributo, el textarea debe ser un descendiente de un elemento formulario. Permite colocar elementos textarea en cualquier lugar dentro de un documento, no sólo como descendientes de  formularios.
maxlength HTML5
Indica el número máximo de caracteres  (Unicode code points) que el usuario puede insertar. Si no está especificado entonces el usuario puede insertar un número ilimitado de caracteres.
minlength HTML5
El mínimo número de caracteres (Unicode code points) que el usuaurio debe insertar.
name
El nombre del control
placeholder HTML5
Se puede añadir un indicación para el usuario que defina que se debe insertar en el control. Los retornos de carro y las nuevas líneas dentro lso marcadores de posición deben ser tratado como nuevas líneas al representar dicha indicación.
readonly
Este atributo booleano indica que el usuario no puede modificar el valor del control. Al contrario que el atributo disable, el atributo readonly no evita que el usuario haga click o seleccione el control. El valor del control read-only si que se envía con el formulario.
required HTML5
Este atributo indica que el usuario debe rellenar el contro con un valor antes de poder enviar el formulario.
rows
El número de líneas visibles en el control
selectionDirection HTML5
La dirección en la que la selección ocurre dentro del control. Es "forward" si la selección ocurre de izquierda a derecha en una localización LTR, o  "backward" si la selección fue hecha en sentido contrario. Puede ser "none" si se desconoce la dirección.
selectionEnd
El índice del último caracter de la selección actual.
selectionStart
El índice del primer caracter de la selección actual.
spellcheck HTML5
Un valor true en este atributo indica que el elemento necesita tener checked el corrector ortográfico y gramatical. El caloor default indica que el elemento va a comportarse de acuerdo al comportamiento por defecto, basado en el spellcheck del padre. El valor false indica que no se deben hacer esas comprobaciones.
wrap HTML5
Indica como el control envuelve al texto. Los posibles valores son:
  • hard: El navegador insertar automáticamente caracteres de nueva línea (CR+LF) para que ninguna línea tenga más anchura que la del control; el atributo  cols debe estar espeficicado.
  • soft: El navegador asegura que todas las nuevas líneas constan de la pareja de caracteres CR+LF , pero no insertar nuevas líneas adicionales.

Soft es el valor por defecto si no se especifica nada.

Interfaz DOM

Este elemento implementa el interfaz HTMLTextAreaElement .

Resizable textareas

Requires Gecko 2.0(Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1)

Gecko 2.0 introduce el soporte para textareas redimensionable. Esto se controla con la propiedad CSS resize . Por defecto la posibilidad de redimiensionar el control está habilitada, pero puede ser explícitamente deshabilitada mediante el uso del siguiente CSS:

textarea {
  resize: none;
}

Interacción con CSS

En relación a CSS, un  <textarea>  es un replaced element. La especificación HTML no define dónde está el punto de referencia de un <textarea>. Así que los diferentes navegadores lo sitúan en diferentes posiciones. En los navegadores basados en Gecko, ese punto de referencia del <textarea> se sitúa en el punto de referencia de la primera línea del <textarea>,  en otro navegadores puede estár situado al final de la caja del <textarea> . Se recomienda no usar vertical-align: baseline , ya que obtendríamos un comportamiento no impredecible.

Un  textarea tiene dimensiones intrínsecas, como una imagen agrandada.

Ejemplo

Contenido HTML 

<textarea name="textarea" rows="10" cols="50">Write something here</textarea>

Especificaciones

Especificación Estado Comentarios
HTML Living Standard
La definición de '<textarea>' en esta especificación.
Living Standard  
HTML5
La definición de '<textarea>' en esta especificación.
Recommendation  
HTML 4.01 Specification
La definición de '<textarea>' en esta especificación.
Recommendation  

Compatibilidad en Navegadores

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidEdge MobileFirefox for AndroidOpera for AndroidiOS SafariSamsung Internet
Soporte básicoChrome Soporte completo SiEdge Soporte completo SiFirefox Soporte completo Si
Notas
Soporte completo Si
Notas
Notas Before Firefox 6, when a <textarea> was focused, the insertion point was placed at the end of the text by default. Other major browsers place the insertion point at the beginning of the text.
Notas A default background-image gradient is applied to all <textarea> elements, which can be disabled using background-image: none.
IE Soporte completo SiOpera Soporte completo SiSafari Soporte completo SiWebView Android Soporte completo SiChrome Android Soporte completo SiEdge Mobile Soporte completo SiFirefox Android Soporte completo Si
Notas
Soporte completo Si
Notas
Notas Before Firefox 6, when a <textarea> was focused, the insertion point was placed at the end of the text by default. Other major browsers place the insertion point at the beginning of the text.
Notas A default background-image gradient is applied to all <textarea> elements, which can be disabled using background-image: none.
Opera Android Soporte completo SiSafari iOS Soporte completo Si
Notas
Soporte completo Si
Notas
Notas Unlike other major browsers, a default style of opacity: 0.4 is applied to disabled <textarea> elements.
Samsung Internet Android Soporte completo Si
autocapitalize
No estándar
Chrome Sin soporte NoEdge Sin soporte NoFirefox Sin soporte NoIE Sin soporte NoOpera Sin soporte NoSafari Sin soporte NoWebView Android Sin soporte NoChrome Android Sin soporte NoEdge Mobile Sin soporte NoFirefox Android Sin soporte NoOpera Android Sin soporte NoSafari iOS Sin soporte NoSamsung Internet Android Sin soporte No
autocompleteChrome Sin soporte No
Notas
Sin soporte No
Notas
Notas See issue 758078.
Edge Sin soporte NoFirefox Soporte completo 59IE Sin soporte NoOpera Sin soporte NoSafari Soporte completo Si
Notas
Soporte completo Si
Notas
Notas See bug 150731.
WebView Android Sin soporte NoChrome Android Sin soporte NoEdge Mobile ? Firefox Android Soporte completo 59Opera Android Sin soporte NoSafari iOS Sin soporte NoSamsung Internet Android Sin soporte No
autofocusChrome Soporte completo SiEdge Soporte completo SiFirefox Soporte completo 4IE Soporte completo 10Opera Soporte completo SiSafari Soporte completo SiWebView Android ? Chrome Android ? Edge Mobile ? Firefox Android Soporte completo 4Opera Android ? Safari iOS ? Samsung Internet Android ?
colsChrome Soporte completo SiEdge Soporte completo SiFirefox Soporte completo SiIE Soporte completo SiOpera Soporte completo SiSafari Soporte completo SiWebView Android Soporte completo SiChrome Android Soporte completo SiEdge Mobile Soporte completo SiFirefox Android Soporte completo SiOpera Android Soporte completo SiSafari iOS Soporte completo SiSamsung Internet Android Soporte completo Si
disabledChrome Soporte completo SiEdge Soporte completo SiFirefox Soporte completo SiIE Soporte completo SiOpera Soporte completo SiSafari Soporte completo SiWebView Android Soporte completo SiChrome Android Soporte completo SiEdge Mobile Soporte completo SiFirefox Android Soporte completo SiOpera Android Soporte completo SiSafari iOS Soporte completo SiSamsung Internet Android Soporte completo Si
formChrome Soporte completo SiEdge Soporte completo SiFirefox Soporte completo SiIE Soporte completo SiOpera Soporte completo SiSafari Soporte completo SiWebView Android Soporte completo SiChrome Android Soporte completo SiEdge Mobile Soporte completo SiFirefox Android Soporte completo SiOpera Android Soporte completo SiSafari iOS Soporte completo SiSamsung Internet Android Soporte completo Si
maxlengthChrome Soporte completo SiEdge Soporte completo SiFirefox Soporte completo 4IE Soporte completo 10Opera Soporte completo SiSafari Soporte completo SiWebView Android ? Chrome Android ? Edge Mobile Soporte completo SiFirefox Android Soporte completo 4Opera Android ? Safari iOS ? Samsung Internet Android ?
minlengthChrome Soporte completo SiEdge Soporte completo SiFirefox Soporte completo SiIE Soporte completo SiOpera Soporte completo SiSafari Soporte completo SiWebView Android Soporte completo SiChrome Android Soporte completo SiEdge Mobile Soporte completo SiFirefox Android Soporte completo SiOpera Android Soporte completo SiSafari iOS Soporte completo SiSamsung Internet Android Soporte completo Si
nameChrome Soporte completo SiEdge Soporte completo SiFirefox Soporte completo SiIE Soporte completo SiOpera Soporte completo SiSafari Soporte completo SiWebView Android Soporte completo SiChrome Android Soporte completo SiEdge Mobile Soporte completo SiFirefox Android Soporte completo SiOpera Android Soporte completo SiSafari iOS Soporte completo SiSamsung Internet Android Soporte completo Si
placeholderChrome Soporte completo SiEdge Soporte completo SiFirefox Soporte completo 4IE Soporte completo 10Opera Soporte completo 11.5Safari Soporte completo 5WebView Android ? Chrome Android ? Edge Mobile Soporte completo SiFirefox Android Soporte completo 4Opera Android Soporte completo 11.5Safari iOS Soporte completo 4Samsung Internet Android ?
readonlyChrome Soporte completo SiEdge Soporte completo SiFirefox Soporte completo SiIE Soporte completo SiOpera Soporte completo SiSafari Soporte completo SiWebView Android Soporte completo SiChrome Android Soporte completo SiEdge Mobile Soporte completo SiFirefox Android Soporte completo SiOpera Android Soporte completo SiSafari iOS Soporte completo SiSamsung Internet Android Soporte completo Si
requiredChrome Soporte completo SiEdge Soporte completo SiFirefox Soporte completo SiIE Soporte completo SiOpera Soporte completo SiSafari Soporte completo SiWebView Android Soporte completo SiChrome Android Soporte completo SiEdge Mobile Soporte completo SiFirefox Android Soporte completo SiOpera Android Soporte completo SiSafari iOS Soporte completo SiSamsung Internet Android Soporte completo Si
rowsChrome Soporte completo SiEdge Soporte completo SiFirefox Soporte completo SiIE Soporte completo SiOpera Soporte completo SiSafari Soporte completo SiWebView Android Soporte completo SiChrome Android Soporte completo SiEdge Mobile Soporte completo SiFirefox Android Soporte completo SiOpera Android Soporte completo SiSafari iOS Soporte completo SiSamsung Internet Android Soporte completo Si
spellcheckChrome Soporte completo SiEdge Soporte completo SiFirefox Soporte completo SiIE Soporte completo SiOpera Soporte completo SiSafari Soporte completo SiWebView Android Soporte completo SiChrome Android Soporte completo SiEdge Mobile Soporte completo SiFirefox Android Soporte completo SiOpera Android Soporte completo SiSafari iOS Soporte completo SiSamsung Internet Android Soporte completo Si
wrapChrome Soporte completo SiEdge Soporte completo SiFirefox Soporte completo SiIE Soporte completo SiOpera Soporte completo SiSafari Soporte completo SiWebView Android Soporte completo SiChrome Android Soporte completo SiEdge Mobile Soporte completo SiFirefox Android Soporte completo SiOpera Android Soporte completo SiSafari iOS Soporte completo SiSamsung Internet Android Soporte completo Si

Leyenda

Soporte completo  
Soporte completo
Sin soporte  
Sin soporte
Compatibility unknown  
Compatibility unknown
No estandar . Esperar poco soporte entre navegadores.
No estandar . Esperar poco soporte entre navegadores.
Ver notas de implementación.
Ver notas de implementación.

 

Ver además

Otros elementos relacionados con formularios: <form>, <button>, <datalist>, <legend>, <label>, <select>, <optgroup>, <option>, <input>, <keygen>, <fieldset>, <output>, <progress> and <meter>.

Etiquetas y colaboradores del documento

Colaboradores en esta página: fscholz, pekechis
Última actualización por: fscholz,