利用css在html中把搜索图标设置上下居中

可以使用flexbox布局来实现搜索图标的上下居中。

首先，在HTML中添加一个包含搜索图标的容器元素，例如一个<div>元素：

<div class="search-icon-container">
  <i class="fa fa-search"></i>
</div>

然后，在CSS中使用flexbox布局来设置容器元素的样式，使其垂直居中：

.search-icon-container {
  display: flex;
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中，可根据需要选择是否添加 */
  height: 100px; /* 设置容器元素的高度，可以根据实际情况调整 */
}

这样，搜索图标就会在容器元素中垂直居中显示。你可以根据实际需要调整容器元素的高度和搜索图标的样式。