--- title:

slug: Web/HTML/Element/textarea
tags:
 - Element
 - Forms
 - HTML
 - HTML forms
 - Reference
 - Web
 - textarea
translation_of: Web/HTML/Element/textarea
---
<h2 id="Sumari">Sumari</h2>

L'element HTML <code><textarea></code> representa un control d'edició de text  multi-línia sense format.

<h2 id="Context_d'ùs">Context d'ùs</h2>

<table class="properties">
 <tbody>
 <tr>
 <th scope="row"><a href="/en-US/docs/HTML/Content_categories" title="HTML/Content_categories">Categories de contingut</a></th>
 <td><a href="/en-US/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">Contingut dinàmic</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content categories#Phrasing content">contingut textual</a>, <a href="/en-US/docs/HTML/Content_categories#Interactive_content" title="HTML/Content categories#Interactive content">contingut interactiu</a>, <a href="/en-US/docs/HTML/Content_categories#Form_listed" title="HTML/Content categories#Form listed">enumerat</a>, <a href="/en-US/docs/HTML/Content_categories#Form_labelable" title="HTML/Content categories#Form labelable">etiquetable</a>, <a href="/en/HTML/Content_categories#form_resettable" title="en/HTML/Content categories#form resettable">reiniciable</a>, i elements <a href="/en-US/docs/HTML/Content_categories#Form_submittable" title="HTML/Content categories#Form submittable">enviables associats a formularis</a>.</td>
 </tr>
 <tr>
 <th scope="row">Contingut permès</th>
 <td>Dades caràcter</td>
 </tr>
 <tr>
 <th scope="row">Omissió de l'etiqueta</th>
 <td>{{no_tag_omission}}</td>
 </tr>
 <tr>
 <th scope="row">Elements pares permesos</th>
 <td>Qualsevol element que accepti <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content categories#Phrasing content">contingut textual</a>.</td>
 </tr>
 <tr>
 <th scope="row">Interfície DOM</th>
 <td>{{domxref("HTMLTextAreaElement")}}</td>
 </tr>
 </tbody>
</table>

<h2 id="Atributs">Atributs</h2>

Aquest element inclou els <a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">atributs globals</a>.

<dl>
 <dt>{{htmlattrdef("autocapitalize")}} {{non-standard_inline}}</dt>
 <dd>Aquest és un atribut no estàndard amb el suport de WebKit en iOS (per tant, gairebé tots els navegadors que s'executen en iOS, incloent Safari, Firefox i Chrome) el qual controla si i com el valor de text ha de ser automàticament en majúscula quan és entrat/editat per l'usuari. Els valors no desaprovats estan disponibles en IOS 5 i posteriors. Els valors possibles són:
 <ul>
 <li><code>none</code>: Completament desactivada la majúscula automàtica.</li>
 <li><code>sentences</code>: Automàticament en majúscula la primera lletra d'una oració .</li>
 <li><code>words</code>: Automàticament en majúscula la primera lletra de les paraules.</li>
 <li><code>characters</code>: Automàticament en majúscula tots els caràcters .</li>
 <li><code>on</code>: {{deprecated_inline()}} Desaprovat des de iOS 5.</li>
 <li><code>off</code>: {{deprecated_inline()}} Desaprovat des de iOS 5.</li>
 </ul>
 </dd>
 <dt>{{htmlattrdef("autocomplete")}} {{HTMLVersionInline("5")}}</dt>
 <dd>Aquest atribut indica si el valor del control es pot completar automàticament pel navegador. Els valors possibles són:
 <ul>
 <li><code>off</code>: L'usuari ha d'introduir explícitament un valor en aquest camp per a cada ús, o el document proporciona el seu propi mètode d'autocompletat; el navegador no completa l'entrada automàticament.</li>
 <li><code>on</code>: El navegador pot completar automàticament el valor basat en els valors que l'usuari ha entrat en usos anteriors.</li>
 </ul>

Si l'atribut autocomplete no s'especifica en un element <code><textarea></code>, el navegador utilitza el valor de l'atribut autocomplete del propietari del formulari de l'element <code><textarea></code>. El propietari del formulari és l'element {{HTMLElement("form")}} en el qual l'element <code><textarea></code> és un descendent o bé l'element de formulari que el seu id és especificat per l'atribut form de l'element d'entrada. Per obtenir més informació, consulteu {{htmlattrxref("autocomplete", "form")}} en {{HTMLElement("form")}}.
 </dd>
 <dt>{{ htmlattrdef("autofocus") }} {{ HTMLVersionInline("5") }}</dt>
 <dd>Aquest atribut booleà permet especificar que un control de formulari ha de tenir el focus d'entrada quan es carrega la pàgina, llevat que l'usuari el redefineixi, per exemple escrivint en un control diferent. Només un element de formularu associat a un document pot tenir aquest atribut especificat.</dd>
 <dt>{{ htmlattrdef("cols") }}</dt>
 <dd>L'ample visible del control de text, en caràcters d'amplària mitjana. Si s'especifica, ha de ser un nombre enter positiu. Si no s'especifica, el valor per defecte és 20 (HTML5).</dd>
 <dt>{{ htmlattrdef("disabled") }}</dt>
 <dd>Aquest atribut booleà indica que l'usuari no pot interactuar amb el control. (Si no s'especifica aquest atribut, el control hereta la seva configuració des de l'element que conté, per exemple {{HTMLElement ("fieldset")}};. Si no hi ha cap element que contimgui l'atribut <code>disabled</code>, el control està activat)</dd>
 <dt>{{ htmlattrdef("form") }} {{ HTMLVersionInline("5") }}</dt>
 <dd>L'element formulari en el qual està associat l'element <code><textarea></code> (el seu "propietari formulari"). El valor de l'atribut ha de ser l'ID d'un element de formulari en el mateix document. Si no s'especifica aquest atribut, l'element <code><textarea></code> ha de ser un descendent d'un element de formulari. Aquest atribut li permet col.locar elements <code><textarea></code> en qualsevol lloc dins d'un document, no només com descendents dels seus elements de formulari.</dd>
 <dt>{{ htmlattrdef("maxlength") }} {{ HTMLVersionInline("5") }}</dt>
 <dd>El nombre màxim de caràcters (punts de codi Unicode) que l'usuari pot introduir. Si no s'especifica aquest valor, l'usuari pot introduir un nombre il·limitat de caràcters</dd>
 <dt>{{ htmlattrdef("minlength") }} {{ HTMLVersionInline("5") }}</dt>
 <dd>El nombre mínim de caràcters (punts de codi Unicode) requerits que l'usuari ha d'introduir.</dd>
 <dt>{{ htmlattrdef("name") }}</dt>
 <dd>El nom del control.</dd>
 <dt>{{ htmlattrdef("placeholder") }} {{ HTMLVersionInline("5") }}</dt>
 <dd>Un indici a l'usuari del que pot ser introduït en el control. Els retorns de carro o salts de línia dins del text de marcador de posició han de ser tractats com salts de línia quan es representa l'indici.</dd>
 <dt>{{ htmlattrdef("readonly") }}</dt>
 <dd>Aquest atribut booleà indica que l'usuari no pot modificar el valor del control. A diferència de l'atribut <code>disabled</code>, l'atribut <code>readonly</code> no impedeix que l'usuari faci clic o seleccioni en el control. El valor d'un control de només lectura segueix sent enviat en el formulari.</dd>
 <dt>{{ htmlattrdef("required") }} {{ HTMLVersionInline("5") }}</dt>
 <dd>Aquest atribut especifica que l'usuari ha d'omplir un valor abans d'enviar un formulari.</dd>
 <dt>{{ htmlattrdef("rows") }}</dt>
 <dd>El nombre de línies de text visibles per al control.</dd>
 <dt>{{ htmlattrdef("selectionDirection") }} {{ HTMLVersionInline("5") }}</dt>
 <dd>La direcció en què es va produir la selecció. És "cap endavant (forward)" si la selecció es va fer d'esquerra a dreta en una configuració regional LTR o de dreta a esquerra en una configuració regional RTL, o "cap enrere (backward)" si la selecció es va fer en la direcció oposada. Això pot ser "cap (none)" si la direcció de la selecció és desconegut.</dd>
 <dt>{{ htmlattrdef("selectionEnd") }}</dt>
 <dd>L'índex de l'últim caràcter de la selecció actual. Si no hi ha selecció, el valor és l'índex del caràcter que segueix a la posició del cursor d'entrada de text.</dd>
 <dt>{{ htmlattrdef("selectionStart") }}</dt>
 <dd>L'índex per al primer caràcter de la selecció actual. Si no hi ha selecció, aquest valor és l'índex del caràcter que segueix a la posició del cursor d'entrada de text.</dd>
 <dt>{{ htmlattrdef("spellcheck") }} {{ HTMLVersionInline(5) }}</dt>
 <dd>Establir el valor d'aquest atribut en <code>true</code> indica que l'element ha de tenir la seva ortografia i gramàtica revisada. El valor per omissió indica que l'element està actuant d'acord amb un comportament predeterminat, possiblement basat en el valor de la revisió ortogràfica de l'element pare. El valor <code>false</code> indica que l'element no ha de ser revisat.</dd>
 <dt>{{ htmlattrdef("wrap") }} {{ HTMLVersionInline("5") }}</dt>
 <dd>Indica com el control ajusta el text. Els valors possibles són:
 <ul>
 <li>hard: El navegador insereix automàticament salts de línia (CR + LF) de manera que cada línia tingui nomes l'ample del control; l'atribut <code>cols</code> ha de ser especificat.</li>
 <li>soft: El navegador s'assegura que tots els salts de línia en el valor consisteixen en un parell CR + LF, però no insereix salts de línia addicionals.</li>
 </ul>

Si no s'especifica aquest atribut, soft és el valor predeterminat.
 </dd>
</dl>

<h2 id="Interfície_DOM">Interfície DOM</h2>

Aquest element implementa la interfície <code><a href="/en/DOM/HTMLTextAreaElement" title="en/DOM/textarea">HTMLTextAreaElement</a></code>.

{{ h1_gecko_minversion("Resizable textareas", "2.0") }}

{{Gecko ("2.0")}} introdueix suport per les textareas redimensionables. Això és controlat per la propietat CSS {{ cssxref("resize") }}. Canviar la mida de les àrees de text està activat per defecte, però es pot desactivar de forma explícita mitjançant la inclusió de la següent CSS:

<pre>textarea {
  resize: none;
}
</pre>

<h2 id="Interacció_amb_CSS">Interacció amb CSS</h2>

Pel que fa a CSS, un <code><textarea></code> és un <a href="https://developer.mozilla.org/en-US/docs/CSS/Replaced_element" title="/en-US/docs/CSS/Replaced_element">element reemplaçat</a>. L'especificació HTML no defineix on està la línia de base d'un <code><textarea></code>. Així que diferents navegadors ajustan a diferents posicions. Per Gecko, la línia de base de un <code><textarea></code> es troba en la línia de base de la primera línia de la primera línia del textarea, en altre navegador pot ajustar a la part inferior del quadre del <code><textarea></code>. No utilitzeu {{cssxref ("vertical-align")}}: <code>baseline</code>, ja que el comportament serà impredictible.

Un textarea té dimensions intrínseques, com una imatge ampliada.

<h2 id="Example" name="Example">Example</h2>

<h3 id="Contingut_HTML">Contingut HTML</h3>

<pre class="brush: html"><textarea name="textarea" rows="10" cols="50">Write something here</textarea></pre>

{{ EmbedLiveSample('Example','600','200') }}

<h2 id="Specifications" name="Specifications">Especificacions</h2>

<table class="standard-table">
 <thead>
 <tr>
 <th scope="col">Especificació</th>
 <th scope="col">Estat</th>
 <th scope="col">Comentari</th>
 </tr>
 </thead>
 <tbody>
 <tr>
 <td>{{SpecName('HTML WHATWG', 'the-button-element.html#the-textarea-element', '<textarea>')}}</td>
 <td>{{Spec2('HTML WHATWG')}}</td>
 <td> </td>
 </tr>
 <tr>
 <td>{{SpecName('HTML5 W3C', 'forms.html#the-textarea-element', '<textarea>')}}</td>
 <td>{{Spec2('HTML5 W3C')}}</td>
 <td> </td>
 </tr>
 <tr>
 <td>{{SpecName('HTML4.01', 'interact/forms.html#h-17.7', '<textarea>')}}</td>
 <td>{{Spec2('HTML4.01')}}</td>
 <td> </td>
 </tr>
 </tbody>
</table>

<h2 id="Navegadors_compatibles">Navegadors compatibles</h2>

<div>

{{Compat("html.elements.textarea")}}
</div>

<h2 id="Veure">Veure</h2>

Altres elements relacionats amb formularis: {{ HTMLElement("form") }}, {{ HTMLElement("button") }}, {{ HTMLElement("datalist") }}, {{ HTMLElement("legend") }}, {{ HTMLElement("label") }}, {{ HTMLElement("select") }}, {{ HTMLElement("optgroup") }}, {{ HTMLElement("option") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("output") }}, {{ HTMLElement("progress") }} and {{ HTMLElement("meter") }}.

{{HTMLRef}}