index.html 4.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <link rel="preconnect" href="https://fonts.gstatic.com">
  7. <link href="https://fonts.googleapis.com/css2?family=Signika:wght@300&display=swap" rel="stylesheet">
  8. <link rel="stylesheet" href="style.css">
  9. <title>Bankline</title>
  10. <link href="https://uploads-ssl.webflow.com/6054b07a1ef8eb1dc44be331/60550c1f87496c57a4e39533_itau-logo-1.png"
  11. rel="shortcut icon" type="image/x-icon">
  12. </head>
  13. <body>
  14. <header>
  15. <p> Banco itaú </p>
  16. </header>
  17. <div class="container">
  18. <h1 style="text-align: center;padding-top:15px;"> Formulário de cadastro </h1>
  19. <form>
  20. <table>
  21. <tr>
  22. <td colspan="3">
  23. <label for="name"><b>Nome</b></label>
  24. <input type="nome" placeholder="Digite seu nome" name="nome" required class="required">
  25. </td>
  26. </tr>
  27. <tr>
  28. <td>
  29. <label for="cpf"><b>CPF</b> <span>inválido</span></label>
  30. <input type="cpf" placeholder="___.___.___-__" data-slots="_"name="cpf" id="cpf" class="required" required >
  31. </td>
  32. <td>
  33. <label for="rg"><b>RG</b></label>
  34. <input type="nome" placeholder="Digite seu RG" name="rg">
  35. </td>
  36. <td>
  37. <label for="sexo"><b>Sexo</b></label>
  38. <select id="sexo" class="w100">
  39. <option selected>Escolha seu sexo</option>
  40. <option value="feminino">Feminino</option>
  41. <option value="masculino">Masculino</option>
  42. <option value="outro">Outro</option>
  43. </select>
  44. </td>
  45. </tr>
  46. <tr>
  47. <td>
  48. <label for="cep"><b>CEP</b></label>
  49. <input type="text" placeholder="Digite seu CEP" name="cep" onblur="pesquisacep(this.value)">
  50. </td>
  51. <td>
  52. <label for="endereco"><b>Endereço</b></label>
  53. <input type="text" placeholder="Digite seu endereço" name="endereco" class="required" required id="endereco">
  54. </td>
  55. <td>
  56. <label for="numero"><b>Número</b></label>
  57. <input type="text" placeholder="Digite o número" name="numero" class="required w100" required>
  58. </td>
  59. </tr>
  60. <tr>
  61. <td>
  62. <label for="bairro"><b>Bairro</b></label>
  63. <input type="nome" placeholder="Digite seu bairro" name="bairro" id="bairro">
  64. </td>
  65. <td>
  66. <label for="cidade"><b>Cidade</b></label>
  67. <input type="nome" placeholder="Digite sua cidade" name="cidade" id="cidade">
  68. </td>
  69. <td>
  70. <label for="estado"><b>Estado</b></label>
  71. <input type="text" placeholder="Confirme seu estado" name="estado" id="estado" class="w100">
  72. </td>
  73. </tr>
  74. <tr>
  75. <td>
  76. <label for="fixo"><b>Telefone fixo</b></label>
  77. <input type="text" placeholder="____-____" data-slots="_"name="fixo">
  78. </td>
  79. <td>
  80. <label for="celular"><b>Telefone celular</b></label>
  81. <input type="text" placeholder="+55 (__) _____-____" data-slots="_" name="celular" class="required" required>
  82. </td>
  83. <td>
  84. <button onclick="return validacao()" type="submit" class="signupbtn">Cadastre-se</button>
  85. </td>
  86. </tr>
  87. </table>
  88. </form>
  89. </div>
  90. <footer>
  91. <p>Direitos reservados a Gabriel Fontineli</p>
  92. </footer>
  93. <script type="text/javascript" src="script.js"></script>
  94. </body>
  95. </html>