html - bootstrap 4 输入中的 ionicons

Question

我想用 bootstrap alpha 4 构建一个输入搜索字段，但我使用的不是 glyphicon 图标或字体 awesom，而是 ionicons，我更喜欢它们。

问题是图标总是在输入框下面，我怎么能把它放到输入框里面。

  <div class="input-group">
    <input type="search" class="form-control">
    <span>
        <i class="ion-ios-search-strong pulse-icons "></i>
    </span>
    </div>

Answer 1

你去吧

  <div class="col-xs-12">
    <div class="input-group filter-search">
      <input type="search" class="form-control" placeholder="Filter nach Namen...">
      <span>
        <i class="ion-ios-search-strong pulse-icons"></i>
      </span>
    </div>
  </div>

您不必根据相对值设置它们，输入大多数设置为相对值。

.input-group span {
  position: absolute;
  left: 0;
  z-index: 2;
}