unslug pt-pt: move

1 files changed, 177 insertions, 0 deletions

diff --git a/files/pt-pt/web/html/element/fieldset/index.html b/files/pt-pt/web/html/element/fieldset/index.html
new file mode 100644
index 0000000000..44fd353489
--- /dev/null
+++ b/files/pt-pt/web/html/element/fieldset/index.html
@@ -0,0 +1,177 @@
+---
+title: '<fieldset>: O elemento "Field Set"'
+slug: Web/HTML/Elemento/fieldset
+tags:
+  - Elemento
+  - Formulários HTML
+  - HTML
+  - Referencia
+  - Web
+  - formulários
+translation_of: Web/HTML/Element/fieldset
+---
+<p>O <strong>elemento HTML <code>&lt;fieldset&gt;</code> </strong>é utilizado para agrupar vários controlos, bem como as etiquetas ({{HTMLElement("label")}}) dentro de um formulário da Web.</p>
+
+<div>{{EmbedInteractiveExample("pages/tabbed/fieldset.html", "tabbed-standard")}}</div>
+
+<p class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> and send us a pull request.</p>
+
+<p>As the example above shows, the <code>&lt;fieldset&gt;</code> element provides a grouping for a part of an HTML form, with a nested {{htmlelement("legend")}} element providing a caption for the <code>&lt;fieldset&gt;</code>. It takes few attributes, the most notable of which are <code>form</code>, which can contain the <code>id</code> of a {{htmlelement("form")}} on the same page, allowing you to make the <code>&lt;fieldset&gt;</code> part of that <code>&lt;form&gt;</code> even if it is not nested inside it, and <code>disabled</code>, which allows you to disable the <code>&lt;fieldset&gt;</code> and all its contents in one go.</p>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>This element includes the <a href="/en-US/docs/HTML/Global_attributes">global attributes</a>.</p>
+
+<dl>
+ <dt>{{htmlattrdef("disabled")}} {{HTMLVersionInline(5)}}</dt>
+ <dd>If this Boolean attribute is set, all form controls that are descendants of the <code>&lt;fieldset&gt;</code>, are disabled, meaning they are not editable but will be submitted along with <code>&lt;form&gt;</code> in comparison with {{htmlattrdef("disabled")}} attribute on form controls. They won't receive any browsing events, like mouse clicks or focus-related events. By default browsers display such controls grayed out. Note that form elements inside the {{HTMLElement("legend")}} element won't be disabled.</dd>
+ <dt>{{htmlattrdef("form")}} {{HTMLVersionInline(5)}}</dt>
+ <dd>This attribute takes the value of the <code>id</code> attribute of a {{HTMLElement("form")}} element you want the <code>&lt;fieldset&gt;</code> to be part of, even if it is not inside the form.</dd>
+ <dt>{{htmlattrdef("name")}} {{HTMLVersionInline(5)}}</dt>
+ <dd>The name associated with the group.
+ <div class="note"><strong>Note</strong>: The caption for the fieldset is given by the first {{HTMLElement("legend")}} element nested inside it.</div>
+ </dd>
+</dl>
+
+<h2 id="Estilizar_com_CSS">Estilizar com CSS</h2>
+
+<p>There are several special styling considerations for <code>&lt;fieldset&gt;</code>.</p>
+
+<p>Its {{cssxref("display")}} value is <code>block</code> by default, and it establishes a block formatting context. If the <code>&lt;fieldset&gt;</code> is styled with an inline-level <code>display</code> value, it will behave as <code>inline-block</code>, otherwise it will behave as <code>block</code>. By default there is a 2px groove border surrounding the contents, and a small amount of default padding. The element has <code>min-inline-size: min-content</code> by default.</p>
+
+<p>If a <code>&lt;legend&gt;</code> is present, it is placed over the block-start border. The <code>&lt;legend&gt;</code> shrink-wraps, and also establishes a formatting context. The <code>display</code> value is blockified (for example, <code>display: inline</code> behaves as <code>block</code>).</p>
+
+<p>There will be an anonymous box holding the contents of the <code>&lt;fieldset&gt;</code>, which inherits certain properties from the <code>&lt;fieldset&gt;</code>. If the <code>&lt;fieldset&gt;</code> is styled with <code>display: grid</code> or <code>display: inline-grid</code>, then the anonymous box will be a grid formatting context. If the <code>&lt;fieldset&gt;</code> is styled with <code>display: flex</code> or <code>display: inline-flex</code>, then the anonymous box will be a flex formatting context. Otherwise it establishes a block formatting context.</p>
+
+<p>You can feel free to style the <code>&lt;fieldset&gt;</code> and <code>&lt;legend&gt;</code> in any way you want to suit your page design.</p>
+
+<div class="note">
+<p><strong>Nota: </strong>as of this writing, there are bugs in Microsoft Edge and Google Chrome which prevent <a href="/en-US/docs/Glossary/Flexbox">flexbox</a> and <a href="/en-US/docs/Web/CSS/CSS_Grid_Layout">grid </a>layouts from being used inside a {{HTMLElement("fieldset")}}. <a href="https://github.com/w3c/csswg-drafts/issues/321">This GitHub issue</a> provides bug tracking links.</p>
+</div>
+
+<h2 id="Exemplo">Exemplo</h2>
+
+<h3 id="Simple_fieldset">Simple fieldset</h3>
+
+<p>This example shows a really simple <code>&lt;fieldset&gt;</code> example, with a <code>&lt;legend&gt;</code>, and a single control inside it.</p>
+
+<pre class="brush: html">&lt;form action="#"&gt;
+  &lt;fieldset&gt;
+    &lt;legend&gt;Simple fieldset&lt;/legend&gt;
+    &lt;input type="radio" id="radio"&gt;
+    &lt;label for="radio"&gt;Spirit of radio&lt;/label&gt;
+  &lt;/fieldset&gt;
+&lt;/form&gt;</pre>
+
+<p>{{ EmbedLiveSample('Simple_fieldset', '100%', '80') }}</p>
+
+<h3 id="fieldset_desativado">"fieldset" desativado</h3>
+
+<p>This example shows a disabled <code>&lt;fieldset&gt;</code> with two controls inside it. Note how both the controls are disabled due to being inside a disabled <code>&lt;fieldset&gt;</code>.</p>
+
+<pre class="brush: html">&lt;form action="#"&gt;
+  &lt;fieldset disabled&gt;
+    &lt;legend&gt;Disabled fieldset&lt;/legend&gt;
+    &lt;div&gt;
+      &lt;label for="name"&gt;Name: &lt;/label&gt;
+      &lt;input type="text" id="name" value="Chris"&gt;
+    &lt;/div&gt;
+    &lt;div&gt;
+      &lt;label for="pwd"&gt;Archetype: &lt;/label&gt;
+      &lt;input type="password" id="pwd" value="Wookie"&gt;
+    &lt;/div&gt;
+  &lt;/fieldset&gt;
+&lt;/form&gt;</pre>
+
+<p>{{ EmbedLiveSample('Disabled_fieldset', '100%', '110') }}</p>
+
+<h2 id="Resumo_técnico">Resumo técnico</h2>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/en-US/docs/HTML/Content_categories">Categorias de conteúdo</a></th>
+   <td><a href="/en-US/docs/HTML/Content_categories#Flow_content">Flow content</a>, <a href="/en-US/docs/Sections_and_Outlines_of_an_HTML5_document#sectioning_root">sectioning root</a>, <a href="/en-US/docs/HTML/Content_categories#form_listed">listed</a>, <a href="/en-US/docs/HTML/Content_categories#form-associated_content">form-associated</a> element, palpable content.</td>
+  </tr>
+  <tr>
+   <th scope="row">Conteúdo permitido</th>
+   <td>An optional {{HTMLElement("legend")}} element, followed by flow content.</td>
+  </tr>
+  <tr>
+   <th scope="row">Omissão de etiqueta</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Permitted parents</th>
+   <td>Any element that accepts <a href="/en-US/docs/HTML/Content_categories#Flow_content">flow content</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Permitted ARIA roles</th>
+   <td>{{ARIARole("group")}}, {{ARIARole("presentation")}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Interface DOM</th>
+   <td>{{domxref("HTMLFieldSetElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Especificações">Especificações</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificação</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentário</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'forms.html#the-fieldset-element', '&lt;fieldset&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Definition of the <code>fieldset</code> element</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'forms.html#the-fieldset-element', '&lt;fieldset&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'interact/forms.html#h-17.10', '&lt;fieldset&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td>Initial definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidade_de_navegador">Compatibilidade de navegador</h2>
+
+
+
+<p>{{Compat("html.elements.fieldset")}}</p>
+
+<h2 id="Consulte_também">Consulte também:</h2>
+
+<ul>
+ <li>Other form-related elements:
+  <ul>
+   <li>{{HTMLElement("form")}}</li>
+   <li>{{HTMLElement("legend")}}</li>
+   <li>{{HTMLElement("label")}}</li>
+   <li>{{HTMLElement("button")}}</li>
+   <li>{{HTMLElement("select")}}</li>
+   <li>{{HTMLElement("datalist")}}</li>
+   <li>{{HTMLElement("optgroup")}}</li>
+   <li>{{HTMLElement("option")}}</li>
+   <li>{{HTMLElement("textarea")}}</li>
+   <li>{{HTMLElement("keygen")}}</li>
+   <li>{{HTMLElement("input")}}</li>
+   <li>{{HTMLElement("output")}}</li>
+   <li>{{HTMLElement("progress")}}</li>
+   <li>{{HTMLElement("meter")}}</li>
+  </ul>
+ </li>
+</ul>
+
+<div>{{HTMLRef}}</div>