html - 将 Bootstrap 样式添加到工作搜索框

Question

我需要更改工作搜索框的样式以匹配主题。

<div class="input-group">
  <input type="text" class="form-control" placeholder="Search">
  <span class="input-group-btn">
        <button class="btn btn-default" type="button">Go!</button>
    </span>
</div>
<!-- /input-group -->
<div class="search_box">
  <form id="form_search" name="form_search" method="get" action="<?php echo site_url();?>">
    <input type="text" name="s" id="search_top" />
    <input type="button" name="btn1" id="btn_top" value="" />
  </form>
</div>

第一个 div 是我需要的样式，第二个是工作搜索框。

目前分别是这样的: http://gyazo.com/ecd1b696f723879d5512588b1d384017

Answer 1

根据您的要求管理父容器的宽度，但获取搜索栏，如您所示:检查链接的 fiddle :

https://jsfiddle.net/happy2deepak/d4jad6ah/

 <div class="input-group">
    <input type="text" class="form-control input-lg" placeholder="Search">
    <span class="input-group-btn">
        <button type="button" class="btn btn-dark btn-lg">Go!</button>
    </span>
 </div>