小編給大家分享一下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進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。