- 搜索框样式1
<div class="col-lg-2 col-md-3 col-sm-3 col-xs-4 pull-right">
<div class="input-group">
<input type="text" class="form-control" placeholder="输入搜索内容">
<span class="input-group-addon" style="color: #FFFFFF;background-color: #2EA7E0;">搜索</span>
</div>
</div>
效果如图所示:
- 搜索框样式2
<div class="col-lg-2 col-md-3 col-sm-3 col-xs-4 pull-right">
<div class="input-group">
<input type="text" class="form-control" placeholder="输入关键字,多关键字空格隔开">
<span class="input-group-btn">
<button class="btn btn-default" type="button" >
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-sousuo"></use>
</svg>
</button>
</span>
</div>
</div>
此时,搜索按钮以svg图标形式展示