首页 > bootsstrap3.5, 这个字体图标怎么才能放在‘input里面’?

bootsstrap3.5, 这个字体图标怎么才能放在‘input里面’?

如图所示,怎么才能把这个字体图标放在input里面呢?


代码:

<div class="form-group">
    <div class="col-md-12">
        <div class="input-group">
            <span class="input-group-addon" id="basic-addon1">密&nbsp;&nbsp;&nbsp;&nbsp;码</span>
            <input id="pass_word" name="pass_word" type="text" class="form-control" placeholder="请输入密码" aria-describedby="basic-addon1">
            <i class="glyphicon glyphicon-eye-open" style="margin-right: -10px;"></i>
        </div>
    </div>
</div>

我尝试过style="margin-right: -10px;", 没作用。


可以做成背景图,然后用background-position定位到最右就可以啦


首先你要把它们放到一行上去,之后用margin-left负值或者position都是可以完成的


<div class="input-group">
    <span class="input-group-addon" id="basic-addon1">密&nbsp;&nbsp;&nbsp;&nbsp;码</span>
    <input id="pass_word" name="pass_word" type="text" class="form-control" placeholder="请输入密码" aria-describedby="basic-addon1">
    <span class="input-group-addon"><i class="glyphicon glyphicon-eye-open"></i></span>
</div>

这个符号用<span>包裹,class为input-group-addon


你看一下input-group有没有相对定位


float:right 或者 position:absolute;right:0px;

【热门文章】
【热门文章】