"Untitled"
Bootstrap 4.1.1 Snippet by siddhu

Post to Facebook Tweet this

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <!doctype html> <html lang="en"> <head> <!-- Required meta tags --> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <!-- Bootstrap CSS --> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"> <title>Hello, world!</title> </head> <body> <h1>Bujji ganapayi ki jai</h1> <div class="container"> <div class="row"><div class="form-group "> <label for="name">Name</label> <input type="text" name="name" class="form-control" id="name" placeholder="Enter the name" aria-describedby="name" data-toggle="tooltip" data-placement="right" title="Yes you are correct" readonly > <small id="name" class="form-text text-muted">Your Original name</small> </div></div><div class="row"><div class="form-group input-group mb-3"> <label for="age">Age</label> <div class="input-group mb-3"> <div class="input-group-prepend"> <span class="input-group-text" id="age">Years</span> </div> <input type="text" name="age" class="form-control" id="age" placeholder="Enter your age" aria-describedby="age" data-toggle="tooltip" data-placement="right" title="Yes you are corrwect" > <div class="input-group-append"> <span class="input-group-text" id="age">Correctly</span> </div> </div> </div><div class="form-group input-group mb-3"> <label for="Tested">Testing</label> <div class="input-group mb-3"> <div class="input-group-prepend"> <span class="input-group-text" id="Tested">tetst</span> </div> <input type="text" name="Tested" class="form-control" id="Tested" placeholder="yes texted" aria-describedby="Tested" data-toggle="tooltip" data-placement="right" title="oyoyo" required > <div class="input-group-append"> <span class="input-group-text" id="Tested">asdasd</span> </div> </div> </div></div><div class="row"><div class="form-group input-group mb-3"> <label for="phone">Phone</label> <div class="input-group mb-3"> <div class="input-group-prepend"> <span class="input-group-text" id="phone">Phone</span> </div> <input type="text" name="phone" class="form-control" id="phone" > </div> </div></div><div class="row"><div class="form-group input-group mb-3"> <label for="email">Email</label> <div class="input-group mb-3"> <div class="input-group-prepend"> <span class="input-group-text" id="email">Email</span> </div> <input type="text" name="email" class="form-control" id="email" placeholder="Please enter the email address" aria-describedby="email" data-toggle="tooltip" data-placement="right" title="Hover text" > </div> </div></div> </div> <!-- Optional JavaScript --> <!-- jQuery first, then Popper.js, then Bootstrap JS --> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script> <script> $(function () { $('[data-toggle="tooltip"]').tooltip(); }) </script> </body> </html>

Related: See More

Material Kit

Questions / Comments: