表单 – 字段中的字体真棒图标输入组

概述我不能让这个图标坐在场内,我只能在上面或下面得到它： <div class="form-group"> <label for="inputFirstName">First Name</label> <div class="input-group"> <div class="input-group addon"> 我不能让这个图标坐在场内,我只能在上面或下面得到它：

<div >            <label for="inputFirstname">First name</label>            <div >              <div >                <i >                </i>                <input type="text"  ID="inputFirstname">              </div>            </div>          </div>.form-group i{  color: #ccc;  float: right;  margin-right: 6px;  position: relative;  z-index: 2;}

我几乎试过阅读这里的每一篇文章,但我感到非常沮丧.

解决方法 你可以像这样使用input-group-addon类：

<div >  <label for="inputFirstname">First name</label>  <div >    <div >      <span  ID="basic-addon1"><i ></i></span>      <input type="text"  ID="inputFirstname">    </div>  </div></div><div >  <label for="inputFirstname">First name</label>  <div >    <div >      <input type="text"  ID="inputFirstname">      <span  ID="basic-addon1"><i ></i></span>    </div>  </div></div>

CODEPEN

总结

以上是内存溢出为你收集整理的表单 – 字段中的字体真棒图标输入组全部内容，希望文章能够帮你解决表单 – 字段中的字体真棒图标输入组所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。