HTML5, CSS3 e validação de formulario

Question

Pessoal, não sei qual o fórum para postar então vou postar aqui e alguma alma caridosa faça-me o favor de mover para o local correto.

Me desculpe a ignorância, mas estou "brincando" com CSS3 3 HTML5 e vi um exemplo de formulário bem interessante:

Como é feita a consistência dos campos obrigatórios e com formatos - email.

No código fonte html:

    <link rel="stylesheet" type="text/css" href="style.css" media="all" />
    <link rel="stylesheet" type="text/css" href="demo.css" media="all" />

    			<p class="contact"><label for="name">Name</label></p> 
    			<input id="nome" name="nome" placeholder="First and last name" required="" tabindex="1" type="text"> 
    			 

No arquivos de estilo não achei nada referente a mensagem de campo obrigatório, nem vi nenhum javascript consistindo e-mail. 

Não achei nenhuma referência a scripts externos.

Na imagem estou rodando local sem estar na internt.

E as menagens estão em português!

Como isto foi feito?

 

---

Ninguém falou que seria fácil!

Answer 1

São várias tags novas no html5 que facilitam a validação de formulários, o que incluí mensagens de alerta estilizados para as mensagens. Isso tudo fica a critério do navegador, logo, só tome cuidado com navegadores mais antigos (principalmente IE), que podem não suportar todas as funções. Mas no Chrome, que usa o Webkit, tudo funciona legal e pode ser visto.

Segue um link para você ver como essas marcações são feitas: http://www.the-art-of-web.com/html/html5-form-validation/

Answer 2

Raphael Moreira,

Muito obrigado.

Agora ficou claro.

---

Ninguém falou que seria fácil!