form.html

<!DOCTYPE html>
<html lang="pt-BR">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Modelo meu</title>
    <link rel="stylesheet" href="./form.css">
</head>

<body>
    <section class="container">

        <h1>Formulário de cadastro</h1>
        <ul>
            <li>Nenhum campo pode estar vazio</li>
            <li>Usuário só poderá conter letras e/ou números</li>
            <li>Usuário deverá ter entre 3 e 12 caracteres</li>
            <li>Senha precisa ter entre 6 e 12 caracteres</li>
        </ul>

        <form action="/" method="post" class=" formulario">
            <label>Nome</label>
            <input type="text" class="nome validar">

            <label>Sobrenome</label>
            <input type="text" class="sobrenome validar">
           
            <label>CPF</label>
            <input type="text" class="cpf validar">

            <label>Usuário</label>
            <input type="text" class="usuario validar">

            <label>Senha</label>
            <input type="password" class="senha validar">

            <label>Repetir Senha</label>
            <input type="password" class="repetir-senha validar">
            
            
            <button>Enviar</button>
        </form>

    </section>
    <script src="./cpfform.js"></script>
    <script src="./form.js"></script>
</body>

</html>