根据左侧字数,右边自动宽度
2020-03-17 本文已影响0人
嵩鼠
样式:
.search_box {
overflow: hidden;
width: 95%;
margin: 0 auto;
}
.no_space {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.search {
height: 58rpx;
line-height: 58rpx;
background: #f5f7f9;
border-radius: 29px;
min-width: 45%;
}
.search input {
font-size: 28rpx;
display: inline-block;
padding-left: 10rpx;
height: 58rpx;
color: #3d4250;
padding-right: 20rpx;
width: 100%;
}
html
<view class="search_box flex">
<view class="city no_space" bindtap="href_city" data-type="1">
<text>全国</text>
</view>
<view class="search flex flex-ac flex2">
<icon type="search" size="12"></icon>
<input type="text" class="" placeholder="搜索活动关键词" />
</view>
</view>