From 68fc8e96a9629e73469ed457abd955e548ec670c Mon Sep 17 00:00:00 2001 From: Florian Merz Date: Thu, 11 Feb 2021 14:49:58 +0100 Subject: unslug pt-br: move --- .../learn/html/forms/html5_updates/index.html | 112 +++++++++++++++++++++ 1 file changed, 112 insertions(+) create mode 100644 files/pt-br/orphaned/learn/html/forms/html5_updates/index.html (limited to 'files/pt-br/orphaned/learn/html') diff --git a/files/pt-br/orphaned/learn/html/forms/html5_updates/index.html b/files/pt-br/orphaned/learn/html/forms/html5_updates/index.html new file mode 100644 index 0000000000..7508276c28 --- /dev/null +++ b/files/pt-br/orphaned/learn/html/forms/html5_updates/index.html @@ -0,0 +1,112 @@ +--- +title: Formulários em HTML +slug: HTML/Forms_in_HTML +translation_of: Learn/HTML/Forms/HTML5_updates +--- +

{{ gecko_minversion_header("2") }}

+ +

Elementos e atributos de formulários em HTML5 proporcionam um grau de marcação semântica maior que HTML4 e remove grande parte da tediosa necessidade de se mexer com scripts e estilos que era necessária em HTML4. As características dos formulários em HTML5 proporcionam uma melhor experiência para usuários por tornarem formulários mais consistentes entre diferentes sites e dar um feedback imediato ao usuário sobre a entrada de dados. Eles também oferecem essa experiência para usuários que possuem scripts desabilitados em seus navegadores.

+ +

Este tópico descreve itens novos ou modificados que são suportados por Gecko/Firefox, versão 4 ou mais recente.

+ +

O elemento <input>

+ +

O elemento {{ HTMLElement("input") }} tem novos valores para o atributo {{ htmlattrxref("type", "input") }}.

+ + + +

O elemento {{ HTMLElement("input") }} também tem novos atributos:

+ + + +

O elemento <form>

+ +

O elemento {{ HTMLElement("form") }} possui um novo atributo:

+ + + +

O elemento <datalist>

+ +

O elemento {{ HTMLElement("datalist") }} representa a lista de elementos {{ HTMLElement("option") }} to suggest when filling an {{ HTMLElement("input") }} field.

+ +

Você pode usar o atributo {{ htmlattrxref("list", "input") }} em um elemento {{ HTMLElement("input") }} para ligar um específico campo de entrada com um específico elemento {{ HTMLElement("datalist") }}.

+ +

O elemento <output>

+ +

O elemento {{ HTMLElement("output") }} representa o resultado de um cálculo.

+ +

Você pode usar o atributo {{ htmlattrxref("for", "output") }} para especificar uma relação entre o elemento {{ HTMLElement("output") }} e outros elementos no documento que afetam o resultado do cálculo (por exemplo, como entradas ou parâmetros). O valor do atributo {{ htmlattrxref("for", "output") }} é uma lista de IDs separados por espaço de outros elementos.

+ +

{{ non-standard_inline() }} Gecko 2.0 (mas não necessariamente outras engines de navegador) suportasupports defining custom validity constraints e mensagens de erro de elementos {{ HTMLElement("output") }} , e portanto aplica as pseudo-classes CSS {{ Cssxref(":invalid") }}, {{ Cssxref(":valid") }}, {{ Cssxref(":-moz-ui-invalid") }}, e {{ Cssxref(":-moz-ui-valid") }} a eles. Isso pode ser útil em situações quando o resultado calculadoThis can be helpful in situations where the calculated result violates a business rule, but no specific input value does (for example, "The total of percentages must not exceed 100").

+ +

O atributo placeholder

+ +

O atributo {{ htmlattrxref("placeholder", "input") }} nos elementos {{ HTMLElement("input") }} e {{ HTMLElement("textarea") }} fornecem uma dica para o usuário do que pode ser inserido no campo. O texto do placeholder não pode conter caracteres de quebra de linha.

+ +

O atributo autofocus

+ +

O atributo {{ htmlattrxref("autofocus", "input") }} permite você especificar um campo de formulário que será focado automaticamente quando a página carregar. No documento, apenas um campo pode ter o atributo autofocus, que é um booleano. Este atributo pode ser aplicado aos seguintes elementos: {{ HTMLElement("input") }}, {{ HTMLElement("button") }}, {{ HTMLElement("select") }}, and {{ HTMLElement("textarea") }}. A única exceção é que o atributo autofocus não pode ser aplicado a um elemento {{ HTMLElement("input") }} caso  seu atributo {{ htmlattrxref("type", "input") }} seja hidden.

+ +

The label.control DOM property

+ +

The HTMLLabelElement DOM interface provides an extra property, in addition to the properties that correspond to the HTML {{ HTMLElement("label") }} element attributes. The control property returns the labeled control, that is, the control that the label is for, which is determined by the {{ htmlattrxref("for", "label") }} attribute (if it is defined) or by the first descendant control element.

+ +

Constraint Validation

+ +

HTML5 provides syntax and API items to support client-side validation of forms. While this functionality does not replace server-side validation, which is still necessary for security and data integrity, client-side validation can support a better user experience by giving the user immediate feedback about input data.

+ +

If the title attribute is set on the {{ HTMLElement("input") }} element, that string is displayed in a tooltip when validation fails. If the title is set to the empty string, no tooltip is displayed. If the title attribute isn't set, the standard validation message (as specified by the {{ htmlattrxref("x-moz-errormessage") }} attribute or by calling the setCustomValidity() method) is displayed instead.

+ +
Note: Constraint validation is not supported on {{ HTMLElement("button") }} elements in a form; to style a button based on the validity of the associated form, use the {{ cssxref(":-moz-submit-invalid") }} pseudo-class.
+ +

HTML Syntax for Constraint Validation

+ +

The following items in HTML5 syntax can be used to specify constraints on form data.

+ + + +

In addition, you can prevent constraint validation by specifying the {{ htmlattrxref("novalidate", "form") }} attribute on the {{ HTMLElement("form") }}, or the {{ htmlattrxref("formnovalidate", "button") }} attribute on the {{ HTMLElement("button") }} element and on the {{ HTMLElement("input") }} element (when {{ htmlattrxref("type", "input") }} is submit or image). These attributes indicate that the form is not to be validated when it is submitted.

+ +

Constraint Validation API

+ +

The following DOM properties and methods related to constraint validation are available to client-side scripts:

+ + + +

{{ languages({"es": "es/HTML/HTML5/Formularios_en_HTML5", "ja": "ja/HTML/HTML5/Forms_in_HTML5", "ko": "ko/HTML/HTML에서_폼"}) }}

+ +

{{ HTML5ArticleTOC() }}

-- cgit v1.2.3-54-g00ecf