亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何將 % 符號永久放在文本框中的文本末尾?

如何將 % 符號永久放在文本框中的文本末尾?

繁星點點滴滴 2023-03-10 13:31:55
我有一個顯示百分比的文本框。我想要文本末尾的 % 符號,% 符號不應該是可編輯的,但文本框中的文本應該是可編輯的。如何實施?
查看完整描述

3 回答

?
開心每一天1111

TA貢獻1836條經驗 獲得超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>


查看完整回答
反對 回復 2023-03-10
?
一只斗牛犬

TA貢獻1784條經驗 獲得超2個贊

像引導程序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>


查看完整回答
反對 回復 2023-03-10
?
POPMUISE

TA貢獻1765條經驗 獲得超5個贊

嘗試這個


<input type="text">

<label style="position:relative; left:-20px;">%</label>


查看完整回答
反對 回復 2023-03-10
  • 3 回答
  • 0 關注
  • 174 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號