Search bar bootstrap

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>

Source: getbootstrap.com

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>

Source: mdbootstrap.com

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>

Source: getbootstrap.com

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>

Similar codes

9 votes285 views4 answers
How to link submit button to another page in html
Html
9 votes278 views3 answers
Relative path
Html
1 vote276 views1 answer
Bootstrap center button horizontally
Html
0 vote253 views1 answer
ClrIfDetail
Html
0 vote283 views1 answer
How to put more than one javascript function in an html tag
Html
15 votes370 views6 answers
Angular ngfor index
Html
79 votes282 views6 answers
Bootstrap radio button
Html
0 vote280 views1 answer
React bootstrap 5 doesn't apply styles
Html
3 votes266 views10 answers
Rick roll
Html
3 votes261 views1 answer
Full Stack web dev meanin
Html