<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 ----------> <form class="form-horizontal"> <fieldset> <!-- Form Name --> <legend>Formulario de validacion</legend> <!-- Text input--> <div class="control-group"> <label class="control-label" for="nombre">nombre</label> <div class="controls"> <input id="nombre" name="nombre" type="text" placeholder="nombre" class="input-medium" required=""> <p class="help-block">Inserte su nombre</p> </div> </div> <!-- Text input--> <div class="control-group"> <label class="control-label" for="apel">apellido</label> <div class="controls"> <input id="apel" name="apel" type="text" placeholder="apellido" class="input-medium" required=""> <p class="help-block">inserte su apelido</p> </div> </div> <!-- Text input--> <div class="control-group"> <label class="control-label" for="tel">telefono</label> <div class="controls"> <input id="tel" name="tel" type="text" placeholder="telefono" class="input-medium" required=""> <p class="help-block">inserte su telefono(9 digitos)</p> </div> </div> <!-- Text input--> <div class="control-group"> <label class="control-label" for="mail">email</label> <div class="controls"> <input id="mail" name="mail" type="text" placeholder="email" class="input-large" required=""> <p class="help-block">inserte un email valido</p> </div> </div> <!-- Text input--> <div class="control-group"> <label class="control-label" for="mail2">mail</label> <div class="controls"> <input id="mail2" name="mail2" type="text" placeholder="mail" class="input-large"> <p class="help-block">inserte de nuevo su email</p> </div> </div> <!-- Multiple Checkboxes --> <div class="control-group"> <label class="control-label" for="find">Como nos ha encontrado</label> <div class="controls"> <label class="checkbox" for="find-0"> <input type="checkbox" name="find" id="find-0" value="No contestar"> No contestar </label> <label class="checkbox" for="find-1"> <input type="checkbox" name="find" id="find-1" value="Publicidad"> Publicidad </label> <label class="checkbox" for="find-2"> <input type="checkbox" name="find" id="find-2" value="Profesional del sector"> Profesional del sector </label> <label class="checkbox" for="find-3"> <input type="checkbox" name="find" id="find-3" value="Internet"> Internet </label> <label class="checkbox" for="find-4"> <input type="checkbox" name="find" id="find-4" value="Amigo / conocido"> Amigo / conocido </label> </div> </div> <!-- Select Basic --> <div class="control-group"> <label class="control-label" for="demandante">Demandante</label> <div class="controls"> <select id="demandante" name="demandante" class="input-medium"> <option>Particular</option> <option>Empresa</option> </select> </div> </div> <!-- Select Basic --> <div class="control-group"> <label class="control-label" for="identificacion">Numero de documento</label> <div class="controls"> <select id="identificacion" name="identificacion" class="input-small"> <option>CIF</option> <option>NIF</option> </select> </div> </div> <!-- Select Basic --> <div class="control-group"> <label class="control-label" for="nombre">Nombre</label> <div class="controls"> <select id="nombre" name="nombre" class="input-medium"> <option>Nombre</option> <option>Empresa</option> </select> </div> </div> <!-- Text input--> <div class="control-group"> <label class="control-label" for="direccion">Direccion</label> <div class="controls"> <input id="direccion" name="direccion" type="text" placeholder="Direccion" class="input-xlarge" required=""> <p class="help-block">Inserte su direccion</p> </div> </div> <!-- Text input--> <div class="control-group"> <label class="control-label" for="codPostal">Codigo Postal</label> <div class="controls"> <input id="codPostal" name="codPostal" type="text" placeholder="Codigo Postal" class="input-medium" required=""> <p class="help-block">5 digitos</p> </div> </div> <!-- Select Basic --> <div class="control-group"> <label class="control-label" for="selectbasic">Provincia</label> <div class="controls"> <select id="selectbasic" name="selectbasic" class="input-medium"> <option>Zaragoza</option> <option>Huesca</option> </select> </div> </div> <!-- Select Basic --> <div class="control-group"> <label class="control-label" for="selectbasic">Localidad</label> <div class="controls"> <select id="selectbasic" name="selectbasic" class="input-medium"> <option>Zaragoza</option> <option>Huesca</option> </select> </div> </div> <!-- Select Basic --> <div class="control-group"> <label class="control-label" for="pais">Pais</label> <div class="controls"> <select id="pais" name="pais" class="input-large"> <option>España</option> <option>Japon</option> </select> </div> </div> <!-- Text input--> <div class="control-group"> <label class="control-label" for="iban">IBAN</label> <div class="controls"> <input id="iban" name="iban" type="text" placeholder="Iban" class="input-medium" required=""> <p class="help-block">Iban</p> </div> </div> <!-- Multiple Radios --> <div class="control-group"> <label class="control-label" for="pago">Forma de pago</label> <div class="controls"> <label class="radio" for="pago-0"> <input type="radio" name="pago" id="pago-0" value="Mensual" checked="checked"> Mensual </label> <label class="radio" for="pago-1"> <input type="radio" name="pago" id="pago-1" value="Trimestral"> Trimestral </label> <label class="radio" for="pago-2"> <input type="radio" name="pago" id="pago-2" value="Anual"> Anual </label> </div> </div> <!-- Text input--> <div class="control-group"> <label class="control-label" for="usuario">Usuario</label> <div class="controls"> <input id="usuario" name="usuario" type="text" placeholder="usuario" class="input-medium" required=""> <p class="help-block">nombre de usuario</p> </div> </div> <!-- Password input--> <div class="control-group"> <label class="control-label" for="pass">Contraseña</label> <div class="controls"> <input id="pass" name="pass" type="password" placeholder="Contraseña" class="input-large" required=""> <p class="help-block">Contraseña</p> </div> </div> <!-- Password input--> <div class="control-group"> <label class="control-label" for="pass2">Contraseña</label> <div class="controls"> <input id="pass2" name="pass2" type="password" placeholder="Contraseña" class="input-large"> <p class="help-block">Introduzca de nuevo su contraseña</p> </div> </div> <!-- Button --> <div class="control-group"> <label class="control-label" for="enviar">Enviar</label> <div class="controls"> <button id="enviar" name="enviar" class="btn btn-success">Enviar</button> </div> </div> </fieldset> </form>