bootstrap3 input 验证样式【转】

feedback

<form role="form">
            <div class="form-group has-success has-feedback">
                <label class="control-label" for="inputSuccess1">成功状态</label>
                <input type="text" class="form-control" id="inputSuccess1" placeholder="成功状态">
                <span class="help-block">你输入的信息是正确的</span>
                <span class="glyphicon glyphicon-ok form-control-feedback"></span>
            </div>
            <div class="form-group has-warning has-feedback">
                <label class="control-label" for="inputWarning1">警告状态</label>
                <input type="text" class="form-control" id="inputWarning1" placeholder="警告状态">
                <span class="help-block">请输入正确信息</span>
                <span class="glyphicon glyphicon-warning-sign form-control-feedback"></span>
            </div>
            <div class="form-group has-error has-feedback">
                <label class="control-label" for="inputError1">错误状态</label>
                <input type="text" class="form-control" id="inputError1" placeholder="错误状态">
                <span class="help-block">你是输入的信息是错误的</span>
                <span class="glyphicon glyphicon-remove form-control-feedback"></span>
            </div>
        </form>

 

效果图:

 

posted @ 2017-01-10 09:02  苦涩泪滴  阅读(493)  评论(0编辑  收藏  举报