TA貢獻(xiàn)1836條經(jīng)驗 獲得超13個贊
您可以使用 :after 偽元素在純 CSS 中完成此操作。
.inputbox-container:after {
content: "\0025";
margin-left: -25px;
margin-right: 25px;
padding-left: 6px;
}
input {
padding-right: 20px;
}
<div class="inputbox-container"><input type="text"></div>
TA貢獻(xiàn)1784條經(jīng)驗 獲得超2個贊
像引導(dǎo)程序input-group
.input-group {
display: flex;
height: 30px
}
.input-group input {
border: 1px solid #ced4da;
width: 30px;
}
.input-group input:focus {
border-color: #80bdff;
outline: 0;
}
.input-group span {
color: #495057;
background-color: #e9ecef;
border: 1px solid #ced4da;
padding: 7px 5px;
}
<div class="input-group">
<input type="text">
<span>%</span>
</div>
TA貢獻(xiàn)1765條經(jīng)驗 獲得超5個贊
嘗試這個
<input type="text">
<label style="position:relative; left:-20px;">%</label>
舉報