How to add icon to input in bootstrap

Recommended tutorial: Bootstrap tutorial

##Sample code

<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>

Rendering:

Interpretation:

1. First, make them One line mainly contains the "

input-group", "input-icon-group" and "input-group-btn" attributes that work

　2. The effect of making the icons in the input appear in the input is mainly "

input-icon input-icon-md" and "display: inline".

　3. For the input box to occupy the entire line of space, instead of having a small width, "

form-control" works.

　4. After entering text in the input box, the icon will not be covered. What works is "

fc-clear".

The above is the detailed content of How to add icon to input in bootstrap. For more information, please follow other related articles on the PHP Chinese website!