BootstrapNo Comments

default thumbnail

To make the input field more attractive, we use the icons before or after after input fields. We need to link the bootstrap css file.

HTML(Icon Before Input field)

<form>
  <div class="input-group">
    <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
    <input id="email" type="text" class="form-control" name="email" placeholder="Email">
  </div>
  <div class="input-group">
    <span class="input-group-addon">Text</span>
    <input id="msg" type="text" class="form-control" name="msg" placeholder="Additional Info">
  </div>
</form>

HTML(Icon After Input field)

<form>
  <div class="input-group">
    <input id="email" type="text" class="form-control" name="email" placeholder="Email">
 <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
  </div>
</form>

Be the first to post a comment.

Add a comment