ELEMENTOS DE FORMULARIO Y

ATRIBUTOS: HTML5

<form> <input> <textarea> <label> <fieldset> <legend> <select> <optgroup> <option> <button> <datalist> <keygen> <output>

ELEMNTOS DE FORMULARIO:

La etiqueta <form> se utiliza para crear un formulario HTML para la entrada del usuario

<form>

La etiqueta <input> especifica un campo de entrada en el que el usuario puede introducir datos. <input > se utilizan dentro de un elemento <form> para declarar controles de entrada que permiten a los usuarios a los datos de entrada .

<input>

La etiqueta <textarea> define un control de entrada de texto de varias líneas. Un área de texto puede contener un número ilimitado de caracteres , y hace que el texto en una fuente de ancho fijo (generalmente Courier). El tamaño de un área de texto puede ser regulado por los columnas y filas , o incluso mejor ; a través de las propiedades CSS de altura y anchura .

<textarea>

Ejemplo de <textarea>

La etiqueta <label> define una etiqueta para un elemento <input>. El elemento <label> no hace como algo especial para el usuario. Sin embargo, proporciona una mejora de usabilidad para los usuarios de ratón , ya que si el usuario hace clic en el texto dentro del elemento <label> , alterna el control. El atributo de la etiqueta <label> debe ser igual al atributo id del elemento relacionado a unirlas .

<label>

Ejemplo de <label>

La etiqueta <fieldset> se utiliza para agrupar elementos relacionados en un formulario. La etiqueta <fieldset> dibuja un cuadro alrededor de los elementos relacionados .

<fieldset>

El <legend > define un título para el elemento <fieldset >.

<legend>

La etiqueta <select> se utiliza para crear una lista desplegable. Las etiquetas <option> dentro del elemento <select> definen las opciones disponibles en la lista.

<select>

La etiqueta <option> define una opción en una lista de selección. La etiqueta <option> va dentro de un <select > o < datalist>.

<option>

La etiqueta < optgroup > se utiliza para opciones relacionadas con el grupo en una lista desplegable. Si usted tiene una larga lista de opciones , grupos de opciones relacionadas son más fáciles de manejar para un usuario.

<optgroup>

La etiqueta <button > define un botón que se pulse . Dentro de un elemento <button> se puede poner el contenido , como texto o imágenes. Esta es la diferencia entre este elemento y botones creados con el elemento <input>.

<button>

La etiqueta < datalist> especifica una lista de opciones predefinidas para un elemento <input> . El < lista de datos > se utiliza para proporcionar una función de " autocompletar " en elementos <input> . Los usuarios verán una lista desplegable de opciones predefinidas , ya que los datos de entrada . Utilice el < input> atributo de lista del elemento para obligar a éste junto con un elemento <datalist>

<datalist>

Ejemplo de <datalist>

La etiqueta < keygen > especifica un campo generador de par de claves utilizado para las formas . Cuando se envía el formulario , la clave privada se almacena localmente , y la clave pública se envía al servidor.

<keygen>

La etiqueta < output> etiqueta representa el resultado de un cálculo (viene precedido por un script)

<output>

accesskey  class contenteditable contextmenu data-* dir draggable dropzone hidden id Lang Spellcheck Style Tabindex Title

ATRIBUOS:

El atributo accesskey especifica una tecla de acceso directo para activar / enfocar un elemento.

accesskey

El atributo class especifica uno o más nombres de las clases de un elemento. El atributo de clase se utiliza sobre todo para que apunte a una clase en una hoja de estilo. También puede ser utilizado por un Java Script para hacer cambios en los elementos HTML con una clase especificada.

class

Ejemplo de class

El atributo contenteditable especifica si el contenido de un elemento se puede editar o no.

contenteditable

El atributo contextmenu especifica un menú contextual de un elemento . El menú contextual aparece cuando un usuario hace clic en el elemento . El valor del atributo contextual es el id del elemento <menu> para abrir.

contextmenu

Ejemplo de contextmenu

El atributo datos * se utiliza para almacenar datos personalizados privado a la página o aplicación. Los atributos de datos * nos da la posibilidad de incrustar datos atributos personalizados en todos los elementos HTML . Los datos almacenados ( personalizado) puede ser utilizado en JavaScript de la página para crear una experiencia de usuario más atractiva ( sin ningún tipo de llamadas Ajax o consultas de bases de datos en el servidor ) . Los atributos de datos * constan de dos partes : El nombre del atributo no debe contener letras mayúsculas , y debe tener al menos un carácter mucho después de que el prefijo " de datos " El valor del atributo puede ser cualquier cadena

Data-*

Ejemplo de data-*

El atributo dir especifica la dirección de texto del contenido del elemento .

dir

El atributo daggable especifica si un elemento es posible arrastrar o no.

daggable

El atributo dropzone especifica si los datos arrastrados se copia , movido o vinculado , cuando se deja caer en un elemento.

dropzone

El atributo hidden es un atributo booleano . Cuando está presente , especifica que un elemento no es todavía , o ya no es , relevante . Los navegadores no deben mostrar los elementos que tienen el atributo oculto especificado . El atributo oculto también se puede utilizar para mantener un usuario vea un elemento hasta que alguna otra condición se ha cumplido ( como seleccionar una casilla de verificación , etc.) . Entonces , un JavaScript podría quitar el atributo oculto , y hacer que el elemento visible .

hidden

Ejemplo de hidden

El atributo id especifica un identificador único para un elemento. El atributo id es más usado para apuntar a un estilo en una hoja de estilo , y por JavaScript ( a través del DOM HTML ) para manipular el elemento con el id específico.

id

El atributo lang especifica el idioma del contenido del elemento.

lang

El atributo spellcheck especifica si el elemento es tener su ortografía y gramática comprueban o no. Lo siguiente puede ser spellcheck: Los valores de texto en elementos de entrada

(no la contraseña) Texto en < textarea> Texto en elementos editables.

spellcheck

Ejemplo de spellcheck

El atributo style especifica un estilo en línea para un elemento. El atributo de estilo anulará cualquier estilo establecido a nivel mundial , por ejemplo, estilos especificados en la etiqueta <style> o en una hoja de estilos externa .

style

El atributo tabindex especifica el orden de tabulación de un elemento ( cuando se utiliza el botón "tab" para navegar ) .

tabindex

El atributo title especifica información adicional acerca de un elemento. La información es más a menudo se muestra como un texto de información sobre herramientas cuando se mueve el ratón sobre el elemento.

title