Example 1: bootstrap 4 search bar
<form class="form-inline"> <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search"> <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button> </form>
Example 2: bootstrap nav search form
<nav class="navbar navbar-light bg-light"> <form class="form-inline"> <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search"> <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button> </form> </nav>
Example 3: select search bootstrap
<select class="selectpicker" data-live-search="true"> <option data-tokens="ketchup mustard">Hot Dog, Fries and a Soda</option> <option data-tokens="mustard">Burger, Shake and a Smile</option> <option data-tokens="frosting">Sugar, Spice and all things nice</option> </select>
Example 4: box search bootstrap
<div class="input-group"> <div class="form-outline"> <input id="search-input" type="search" id="form1" class="form-control" /> <label class="form-label" for="form1">Search</label> </div> <button id="search-button" type="button" class="btn btn-primary"> <i class="fas fa-search"></i> </button> </div>
Example 5: search bar bootstrap
<div class="input-group"> <input id="search-input" type="search" class="form-control" placeholder="Search anything..."> <button id="search-button" type="button" class="btn btn-primary"> <i class="fa fa-search"></i> </button> </div>
Comments
Post a Comment