input框内放入竖线以及获取验证码应该怎么样实现？

Question

问一下，这种input框内放入竖线以及获取验证码应该怎么样实现？

Answer 1

input+span写，或者你用绝对定位把文字定位过去
emmm...

<div class="box">
    <input class="input" placeholder="请输入验证码" />
    <span class="text">获取验证码</span>
</div>

<style>
.box {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #000;
    width: 250px;
}
.input {
    border: none;
    outline: none;
    width: 150px;
}
.text {
    border-left: 1px solid #a1a2a3;
    height: 15px;
    width: 100px;
    display: inline-block;
    line-height: 15px;
    padding-left: 15px;
    font-size: 12px;
    color: #606266
}
</style>

Answer 2

左边是个无边框的input，左右分离吧

Answer 3

input+laber,竖线用laber左边框~~