小程序-搜索框

 

 

<view class="titleBar-view " style="margin-top:{{heightTop}}px">
  <view class="titleBar-input">
    <image class="titleBar-img" src="../../images/home/search.png" mode="aspectFit"></image>
    <text class="titleBar-text">搜索品｜产关键词</text>
  </view>
</view>

.titleBar-view {
  background: #ffffff;
  padding-left: 28rpx;
  padding-right: 28rpx;
  padding-top: 20rpx;
  padding-bottom: 20rpx;
  text-align: center;
}

.home-view {
  width: 686rpx;
  margin-left: 26rpx;
  margin-right: 26rpx;
  background: #ffffff;
}

.titleBar-input {
  background: #F3F3F3;
  height: 60rpx;
  width: 686rpx;
  line-height: 60rpx;
  border-radius: 30rpx;
  vertical-align: middle;
}

.titleBar-img {
  width: 22rpx;
  height: 22rpx;
  margin-right: 22rpx;
}

.titleBar-text {
  font-size: 24rpx;
  font-family: PingFang-SC-Bold;
  color: #888888;
}