效果图
代码
<div class="y-start item-default-height pl10">
<div class="text-deep laebl-small">渠道</div>
<label class="input-width-lg label-input" :class="[qdmc ? 'text-deep' : 'text-plac']">{{ qdmc || '请选择渠道' }}</label>
<!-- <Input size="small" class="text-deep input-width-lg" readonly v-model="qdmc" placeholder="请选择渠道" /> -->
</div>
css
.label-input{
height: 24px;
line-height: 24px;
border-bottom: 1px solid rgb(183, 190, 199);
position: relative;
}
.label-input::after{
content: '';
width: 0px;
height: 0px;
position: absolute;
right: 0;
bottom: 2px;
z-index: 1;
border-width: 12px 12px 0 0;
border-style: solid;
border-color: transparent rgb(183, 190, 199);
}