getbootstrap

In this example below you will see how to do a getbootstrap with some HTML / CSS and Javascript

Thumbnail
This awesome code was written by hailinhflp, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright hailinhflp ©

Technologies

  • HTML
<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  <title>getbootstrap</title>
  
  
  
  
  
</head>

<body>

  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<div class="container">
      <h2>Glyphicon Examples</h2>
  <h3> <a href="https://getbootstrap.com/components/">Xem ICON ở đây</a></h3>
      <p>Envelope icon: <span class="glyphicon glyphicon-envelope"></span></p>
      <p>Envelope icon as a link:
        <a href="#">
          <span class="glyphicon glyphicon-envelope"></span>
        </a>
      </p>
      <p>Search icon: <span class="glyphicon glyphicon-search"></span></p>
      <p>Search icon on a button:
        <button type="button" class="btn btn-default">
          <span class="glyphicon glyphicon-search"></span> Search
        </button>
      </p>
      <p>Search icon on a styled button:
        <button type="button" class="btn btn-info">
          <span class="glyphicon glyphicon-search"></span> Search
        </button>
      </p>
      <p>Print icon: <span class="glyphicon glyphicon-print"></span></p>
      <p>Print icon on a styled link button:
        <a href="#" class="btn btn-success btn-lg">
          <span class="glyphicon glyphicon-print"></span> Print
        </a>
      </p>
      <p> <span class="glyphicon glyphicon-align-right"></span> Chym
        <!-- Search -->
  <div class="col-lg-6">
    <div class="input-group">
      <input type="text" class="form-control" placeholder="Search for...">
      
      <span class="input-group-btn">
        <button class="btn btn-default" type="button">Go!</button>
      </span>
    </div><!-- /input-group -->
  </div><!-- /.col-lg-6 -->
</div><!-- /.row -->


<!-- form search-->
<form class="navbar-form navbar-left" role="search">
  <div class="form-group">
    <input type="text" class="form-control" placeholder="Search">
  </div>
  <button type="submit" class="btn btn-default">Submit</button>
</form>



    </div>
  
  

</body>

</html>

Comments