您好,登錄后才能下訂單哦!
這期內容當中小編將會給大家帶來有關bootstrap中如何給input添加圖標,文章內容豐富且以專業的角度為大家分析和敘述,閱讀完這篇文章希望大家可以有所收獲。
示例代碼
<div class="input-group"> <div class="input-icon-group"> <input type="text" class="form-control fc-clear" /> <span id="scan" data-role="md" class="md md-center-focus-weak fa-lg input-icon input-icon-md" style="display: inline;"> </span> </div> <span class="input-group-btn"> <button class="btn btn-primary" type="button"> 批號 </button> </span></div>
效果圖:
解讀:
1、首先使得他們在一行主要是"input-group
"、“input-icon-group
”和“input-group-btn
”屬性起作用
2、使得input里面的圖標在input里面展現的效果主要是“input-icon input-icon-md
”起作用,和“display: inline
”起作用。
3、對于input框能夠占據整行空隙,而不是寬度很小,起作用的是“form-control
”。
4、對于input框里面輸入文字后,不會覆蓋圖標,起作用的是“fc-clear
”。
上述就是小編為大家分享的bootstrap中如何給input添加圖標了,如果剛好有類似的疑惑,不妨參照上述分析進行理解。如果想知道更多相關知識,歡迎關注億速云行業資訊頻道。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。