Atributos de nuevos elementos de formulario en html5

patrón: Con esto se puede especificar una expresión regular utilizada para validar el formulario. Si el contenido coincide con la expresión regular, el campo será considerada válida. Utilice este atributo sólo cuando las técnicas de validación estándar no son suficientes, ya que puede ser difícil de depurar expresiones regulares.

Video: Validación de Campos con HTML 5

Cuando se especifica una patrón, también incluir una título atributo para indicar cuál es el patrón, como en el código de ejemplo:

El navegador puede utilizar esto como un consejo para el usuario. También puede ser útil añadir información del patrón como texto del marcador.

marcador de posición: los marcador de posición actúa como una etiqueta temporal que muestra el propósito de un campo de texto sin necesidad de una etiqueta etiqueta. Tan pronto como el usuario activa el campo, el texto del marcador desaparece. Una muestra de la simple código:

No todos los navegadores soportan texto del marcador, y algunos simplemente ignorar la marcador de posición atributo. Del mismo modo, si el campo ya se rellena, el marcador de posición no será visible. Por estas razones, añadir una etiqueta que los usuarios sepan qué debe escribir en cada área de texto.

texto del marcador es especialmente útil para indicar la forma en la entrada debe tener el formato (especialmente si esto va a ser aplicada por validación o un patrón).

necesario: navegadores que soporten marcarán todos necesario campos (quizás resaltándolos en rojo) si no se rellenan. Algunos navegadores también enviar una advertencia si el usuario intenta enviar un formulario con campos obligatorios vacíos.

El especial :necesario pseudo-clase le permite aplicar un estilo CSS a todos los elementos requeridos en el formulario (dándoles un color de borde o fondo, por ejemplo). Aquí está un ejemplo de un estilo CSS para marcar elementos requeridos con un borde rojo:

 : Necesaria {border: 1px sólido rojo-}

Si se requiere un campo (con la necesario atribuir), que serán considerados válidos hasta que contenga algún valor.

Video: Curso HTML 5. Formularios I. Vídeo 21

Validación: la validación de formularios es una de las partes más difíciles del desarrollo Web. Es bastante fácil de configurar un formulario que pide la información del usuario, pero puede ser muy difícil estar seguro de que el usuario introduce la información correctamente.

HTML5 le ayuda a cabo. Cuando se utilizan los elementos de entrada de propósito especial, el navegador comprobará automáticamente el campo de formulario para asegurarse de que está en un formato adecuado. Si la entrada no es válida, el formulario (en general) no presentó, y el especial :inválido CSS pseudo-clase se asocia con el campo no válido. Simplemente suministrar CSS a la página de manejo de la :inválido estado:

Video: Curso HTML 5. figure figcaption y Nuevos elementos. Vídeo 5

: Inválido {background-color: rojo-}

Cuando este estado CSS está activo, cualquiera de los campos no válidos tendrán la :inválido peinado. Por ejemplo, si tiene una color terreno y el estilo CSS fondo rojo se define aquí, el campo de color tendrán un fondo rojo a menos que el usuario introduce un color válido (un nombre de color reconocido o el valor de color hexadecimal). Asimismo, el correo electrónico campo mostrará de color rojo hasta que se introduzca una dirección válida de correo electrónico. No es necesario añadir ningún otro código para el formulario. Basta con añadir CSS para mostrar las entradas no válidas, y el navegador se encargará del resto.

Se puede desactivar la validación de cualquier campo mediante la adición de la novalidate atribuir a ese elemento.

Es posible que el navegador va a rechazar la tramitación de una forma hasta que todos los campos son validados, pero este comportamiento no parece ser universal entre los navegadores compatibles con HTML5.