"Registration Form"
Bootstrap 3.3.0 Snippet by xmatzx01

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 ----------> <body background="./images/pattern2.jpg"> <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet"> <div id="login-overlay" class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <h4 class="modal-title" id="myModalLabel">Register with YaelsEverythingStore.com</h4> <p>Please Register to Shop at <b>Yael's Everything Store</b>. You will instantly receive hundreds of amazing shopping deals, or go back to our <a href="./index.jsp">main site</a>.</p> </div> <div class="modal-body"> <form id="registerForm" method="POST" > <!---form---> <div class="form-group"> <!---input width---> <div class="col-xs-6"> <label for="InputName">First Name</label> <div class="input-group"> <input type="text" class="form-control" name="first_name" placeholder="Enter First Name" required> <span class="input-group-addon"><span class="glyphicon glyphicon-asterisk"></span></span> </div> <br> <label for="InputName">Username</label> <div class="input-group"> <input type="text" class="form-control" name="username" placeholder="Enter Username" required> <span class="input-group-addon"><span class="glyphicon glyphicon-asterisk"></span></span> </div> <!--------------------------------------separator---------------------------------------------------------------> <hr> </div> </div> <div class="form-group"> <div class="col-xs-6"> <label for="InputName">Last Name</label> <div class="input-group"> <input type="text" class="form-control" name="last_name" placeholder="Enter Last Name" required> <span class="input-group-addon"><span class="glyphicon glyphicon-asterisk"></span></span> </div> <br> <label for="InputPassword">Enter Password</label> <div class="input-group"> <input type="password" class="form-control" name="password" placeholder="Enter Password" required> <span class="input-group-addon"><span class="glyphicon glyphicon-asterisk"></span></span> </div> <!--------------------------------------separator---------------------------------------------------------------> <hr> </div> </div> <div class="form-group"> <div class="col-xs-12"> <label for="InputEmail">Enter Email</label> <div class="input-group"> <input type="email" class="form-control" name="email" placeholder="Enter Email" required> <span class="input-group-addon"><span class="glyphicon glyphicon-asterisk"></span></span> </div> <!----------------------------break-------------------------------------------------------------> <br> </div> </div> <div class="form-group"> <div class="col-xs-12"> <label for="InputStreetName">Address</label> <div class="input-group"> <input type="text" class="form-control" name="street_name" placeholder="Enter Street Name and Number" required> <span class="input-group-addon"><span class="glyphicon glyphicon-asterisk"></span></span> </div> <!----------------------------break-------------------------------------------------------------> <br> </div> </div> <div class="form-group"> <div class="col-xs-12"> <label for="InputCity">City</label> <div class="input-group"> <input type="text" class="form-control" name="city" placeholder="Enter City" required> <span class="input-group-addon"><span class="glyphicon glyphicon-asterisk"></span></span> </div> <!----------------------------break-------------------------------------------------------------> <br> </div> </div> <div class="form-group"> <div class="col-xs-12"> <label for="InputProvince">Province</label> <div class="input-group"> <input type="text" class="form-control" name="province" placeholder="Enter Province" required> <span class="input-group-addon"><span class="glyphicon glyphicon-asterisk"></span></span> </div> <!----------------------------break-------------------------------------------------------------> <br> </div> </div> <div class="form-group"> <div class="input-group-addon"> <input type="submit" name="submit" id="submit" value="Submit" class="btn btn-success pull-right"> </div> </div> </form> </div><!---modal-body---> </div> </div> <script type="text/javascript"> </script> </body> </html>

Related: See More

Vue Material Kit
Bootstrap 4 Simple Registration Form
Bootstrap Dual Design Registration Form
login-form

Questions / Comments:

wow this awesome...

Bryan Granse () - 8 years ago - Reply 0