"Login Register Form Bootstrap"
Bootstrap 3.0.0 Snippet by Anita26

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.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 ---------->
<!--forms-->
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
<div class="space-medium">
<div class="container">
<div class="row">
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
<div class="account-holder">
<!--login-form-->
<h3>Login to Today’s Fashion</h3>
<br>
<div class="social-btn">
<h6>Sign in With</h6>
<div class="fb-btn">
<i class="fa fa-facebook-official"></i><a href="#" class="fb-btn-text">facebook</a>
</div>
<div class="google-btn">
<i class="fa fa-google"></i><a href="#" class="google-btn-text">Google</a>
</div>
</div>
<div class="row">
<form>
<div class="col-lg-12 col-md-12 col-sm-6 col-xs-12">
<div class="form-group">
<label class="control-label required" for="email">Email<sup style="color:red">*</sup></label>
<input id="email" name="email" type="text" class="form-control" placeholder="Enter Email Address">
</div>
</div>
<div class="col-lg-12 col-md-12 col-sm-6 col-xs-12">
<div class="form-group">
<label class="control-label required" for="email">Password<sup style="color:red">*</sup></label>
<input id="password" name="password" type="password" class="form-control" placeholder="password">
</div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
h1, h2, h3, h4, h5, h6 { font-weight: 600; color: #301c1e; font-family: 'Hind Siliguri', sans-serif; margin: 0px 0px 15px 0px; letter-spacing: 1.6px; text-transform: uppercase; }
a { text-decoration: none; color: #301c1e; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
a:focus, a:hover { text-decoration: none; color: #f25b6a; }
/*------------------------
Account
--------------------------*/
.account-holder { border: 1px solid #ededed; padding: 30px; }
.social-btn { margin-bottom: 20px; }
.fb-btn { border: 1px solid #ededed; padding: 7px 18px; display: inline-block; color: #3a549e; font-size: 14px; margin-bottom: 20px; }
.fb-btn-text { padding-left: 8px; font-size: 14px; text-transform: uppercase; letter-spacing: 1.6px; color: #301c1e; font-weight: 700; }
.google-btn { border: 1px solid #ededed; padding: 7px 18px; display: inline-block; color: #f04c42; font-size: 14px; margin-left: 10px; }
.google-btn-text { padding-left: 8px; font-size: 14px; text-transform: uppercase; letter-spacing: 1.6px; color: #301c1e; font-weight: 700; }
.forgot-password { color: #f25b6a; text-transform: uppercase; font-size: 12px; font-weight: 700; display: block; margin-bottom: 16px; }
.btn { font-family: 'Hind Siliguri', sans-serif; font-size: 15px; text-transform: uppercase; font-weight: 600; padding: 14px 24px; margin-bottom: 4px; letter-spacing: 2.2px; border-radius: 0px; line-height: 1.6; border: transparent; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; word-wrap: break-word; white-space: normal !important; }
.btn-primary { background-color: #f25b6a; color: #fff; }
.btn-primary:hover { background-color: #e14e5c; color: #fff; }
/*-----------------------
Form Elements:
-------------------------*/
label { }
.control-label { font-size: 14px; text-transform: uppercase; letter-spacing: 1px; color: #301c1e; margin-bottom: 10px; }
.form-control:focus { }
.textarea.form-control { }
.required { }
.form-control { border-radius: 0px; text-transform: capitalize; color: #aca5a5; font-size: 12px; font-weight: 500; width: 100%; height: 50px; padding: 14px; line-height: 1.42857143; background-image:; border: transparent; background-color: #f1f1f1; letter-spacing: 1px; margin-bottom: 10px; text-transform: uppercase; -webkit-box-shadow: inset 0 0px 0px rgba(0, 0, 0, .075); box-shadow: inset 0 0px 0px rgba(0, 0, 0, .075); }
.input-group { position: relative; display: table; border-collapse: separate; }
input[type=checkbox], input[type=radio] { margin: 8px 0 0; margin-top: 1px\9; line-height: normal; }
input::-webkit-input-placeholder { color: #595857 !important; }
textarea::-webkit-input-placeholder { color: #595857 !important; }
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More


Questions / Comments: