1<form>
2 <div class="form-row">
3 <div class="col-md-4 mb-3">
4 <label for="validationDefault01">First name</label>
5 <input type="text" class="form-control" id="validationDefault01" placeholder="First name" value="Mark" required>
6 </div>
7 <div class="col-md-4 mb-3">
8 <label for="validationDefault02">Last name</label>
9 <input type="text" class="form-control" id="validationDefault02" placeholder="Last name" value="Otto" required>
10 </div>
11 <div class="col-md-4 mb-3">
12 <label for="validationDefaultUsername">Username</label>
13 <div class="input-group">
14 <div class="input-group-prepend">
15 <span class="input-group-text" id="inputGroupPrepend2">@</span>
16 </div>
17 <input type="text" class="form-control" id="validationDefaultUsername" placeholder="Username" aria-describedby="inputGroupPrepend2" required>
18 </div>
19 </div>
20 </div>
21 <div class="form-row">
22 <div class="col-md-6 mb-3">
23 <label for="validationDefault03">City</label>
24 <input type="text" class="form-control" id="validationDefault03" placeholder="City" required>
25 </div>
26 <div class="col-md-3 mb-3">
27 <label for="validationDefault04">State</label>
28 <input type="text" class="form-control" id="validationDefault04" placeholder="State" required>
29 </div>
30 <div class="col-md-3 mb-3">
31 <label for="validationDefault05">Zip</label>
32 <input type="text" class="form-control" id="validationDefault05" placeholder="Zip" required>
33 </div>
34 </div>
35 <div class="form-group">
36 <div class="form-check">
37 <input class="form-check-input" type="checkbox" value="" id="invalidCheck2" required>
38 <label class="form-check-label" for="invalidCheck2">
39 Agree to terms and conditions
40 </label>
41 </div>
42 </div>
43 <button class="btn btn-primary" type="submit">Submit form</button>
44</form>
1<form>
2 <div class="form-group">
3 <label for="exampleFormControlInput1">Email address</label>
4 <input type="email" class="form-control" id="exampleFormControlInput1" placeholder="name@example.com">
5 </div>
6 <div class="form-group">
7 <label for="exampleFormControlSelect1">Example select</label>
8 <select class="form-control" id="exampleFormControlSelect1">
9 <option>1</option>
10 <option>2</option>
11 <option>3</option>
12 <option>4</option>
13 <option>5</option>
14 </select>
15 </div>
16 <div class="form-group">
17 <label for="exampleFormControlSelect2">Example multiple select</label>
18 <select multiple class="form-control" id="exampleFormControlSelect2">
19 <option>1</option>
20 <option>2</option>
21 <option>3</option>
22 <option>4</option>
23 <option>5</option>
24 </select>
25 </div>
26 <div class="form-group">
27 <label for="exampleFormControlTextarea1">Example textarea</label>
28 <textarea class="form-control" id="exampleFormControlTextarea1" rows="3"></textarea>
29 </div>
30</form>
1<form>
2 <div class="form-group row">
3 <label for="staticEmail" class="col-sm-2 col-form-label">Email</label>
4 <div class="col-sm-10">
5 <input type="text" readonly class="form-control-plaintext" id="staticEmail" value="email@example.com">
6 </div>
7 </div>
8 <div class="form-group row">
9 <label for="inputPassword" class="col-sm-2 col-form-label">Password</label>
10 <div class="col-sm-10">
11 <input type="password" class="form-control" id="inputPassword" placeholder="Password">
12 </div>
13 </div>
14</form>
1<!-- Default form login -->
2<form class="text-center border border-light p-5" action="#!">
3
4 <p class="h4 mb-4">Sign in</p>
5
6 <!-- Email -->
7 <input type="email" id="defaultLoginFormEmail" class="form-control mb-4" placeholder="E-mail">
8
9 <!-- Password -->
10 <input type="password" id="defaultLoginFormPassword" class="form-control mb-4" placeholder="Password">
11
12 <div class="d-flex justify-content-around">
13 <div>
14 <!-- Remember me -->
15 <div class="custom-control custom-checkbox">
16 <input type="checkbox" class="custom-control-input" id="defaultLoginFormRemember">
17 <label class="custom-control-label" for="defaultLoginFormRemember">Remember me</label>
18 </div>
19 </div>
20 <div>
21 <!-- Forgot password -->
22 <a href="">Forgot password?</a>
23 </div>
24 </div>
25
26 <!-- Sign in button -->
27 <button class="btn btn-info btn-block my-4" type="submit">Sign in</button>
28
29 <!-- Register -->
30 <p>Not a member?
31 <a href="">Register</a>
32 </p>
33
34 <!-- Social login -->
35 <p>or sign in with:</p>
36
37 <a href="#" class="mx-2" role="button"><i class="fab fa-facebook-f light-blue-text"></i></a>
38 <a href="#" class="mx-2" role="button"><i class="fab fa-twitter light-blue-text"></i></a>
39 <a href="#" class="mx-2" role="button"><i class="fab fa-linkedin-in light-blue-text"></i></a>
40 <a href="#" class="mx-2" role="button"><i class="fab fa-github light-blue-text"></i></a>
41
42</form>
43<!-- Default form login -->