"Register Page "
Bootstrap 3.3.0 Snippet by lucassilvavi

Post to Facebook Tweet this

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <!DOCTYPE html> <html lang="en"> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" type="text/css" href="assets/css/bootstrap.css"> <!-- Website CSS style --> <link rel="stylesheet" type="text/css" href="assets/css/main.css"> <!-- Website Font style --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css"> <!-- Google Fonts --> <link href='https://fonts.googleapis.com/css?family=Passion+One' rel='stylesheet' type='text/css'> <link href='https://fonts.googleapis.com/css?family=Oxygen' rel='stylesheet' type='text/css'> <title>Admin</title> </head> <div class="container"> <div class="row"> <h2>Create your snippet's HTML, CSS and Javascript in the editor tabs</h2> <form class="form-horizontal"> <fieldset> <!-- Form Name --> <legend>Cadastro de Cliente</legend> <!-- Text input--> <div class="control-group"> <label class="control-label" for="nometext">Nome</label> <div class="controls"> <input id="nometext" name="nometext" type="text" placeholder="" class="input-xlarge"> </div> </div> <!-- Text input--> <div class="control-group"> <label class="control-label" for="sobrenometext">Sobrenome</label> <div class="controls"> <input id="sobrenometext" name="sobrenometext" type="text" placeholder="" class="input-xlarge"> </div> </div> <!-- Multiple Radios (inline) --> <div class="control-group"> <label class="control-label" for="radiosEXO">Sexo</label> <div class="controls"> <label class="radio inline" for="radiosEXO-0"> <input type="radio" name="radiosEXO" id="radiosEXO-0" value="M" checked="checked"> M </label> <label class="radio inline" for="radiosEXO-1"> <input type="radio" name="radiosEXO" id="radiosEXO-1" value="F"> F </label> </div> </div> <!-- Text input--> <div class="control-group"> <label class="control-label" for="telefonetext">Telefone</label> <div class="controls"> <input id="telefonetext" name="telefonetext" type="text" placeholder="" class="input-medium"> </div> </div> <!-- Text input--> <div class="control-group"> <label class="control-label" for="enderecotext">Endereço</label> <div class="controls"> <input id="enderecotext" name="enderecotext" type="text" placeholder="" class="input-xlarge"> </div> </div> <!-- Text input--> <div class="control-group"> <label class="control-label" for="complementotext">Complemento</label> <div class="controls"> <input id="complementotext" name="complementotext" type="text" placeholder="" class="input-large"> </div> </div> <!-- Text input--> <div class="control-group"> <label class="control-label" for="cidadetext">Cidade</label> <div class="controls"> <input id="cidadetext" name="cidadetext" type="text" placeholder="" class="input-xlarge"> </div> </div> <!-- Text input--> <div class="control-group"> <label class="control-label" for="uftext">UF</label> <div class="controls"> <input id="uftext" name="uftext" type="text" placeholder="" class="input-mini"> </div> </div> <!-- Text input--> <div class="control-group"> <label class="control-label" for="ceptext">CEP</label> <div class="controls"> <input id="ceptext" name="ceptext" type="text" placeholder="" class="input-small"> </div> </div> <!-- Button (Double) --> <div class="control-group"> <label class="control-label" for="buttoncadastrar"></label> <div class="controls"> <button id="buttoncadastrar" name="buttoncadastrar" class="btn btn-success">Cadastrar</button> <button id="buttonsair" name="buttonsair" class="btn btn-danger">Sair</button> </div> </div> </fieldset> </form> </div> </div> <script type="text/javascript" src="assets/js/bootstrap.js"></script> </body> </html>
/* /* Created by Filipe Pina * Specific styles of signin, register, component */ /* * General styles */ body, html{ height: 100%; background-repeat: no-repeat; background-color: #d3d3d3; font-family: 'Oxygen', sans-serif; } .main{ margin-top: 70px; } h1.title { font-size: 50px; font-family: 'Passion One', cursive; font-weight: 400; } hr{ width: 10%; color: #fff; } .form-group{ margin-bottom: 15px; } label{ margin-bottom: 15px; } input, input::-webkit-input-placeholder { font-size: 11px; padding-top: 3px; } .main-login{ background-color: #fff; /* shadows and rounded borders */ -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; -moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3); box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3); } .main-center{ margin-top: 30px; margin: 0 auto; max-width: 330px; padding: 40px 40px; } .login-button{ margin-top: 5px; } .login-register{ font-size: 11px; text-align: center; }

Related: See More

Paper Kit 2 PRO Angular
Elegant Login Page
My Awesome Login Page
Simple & Clean 404 Error Page style

Questions / Comments: