html - 使用 Bootstrap 3 和 AngularJS 在输入字段后添加星号

Question

<div class="form-group form-group-lg">
    <label class="col-md-2 control-label">{{translation.FIRST_NAME}}:</label>
    <div class="col-md-10 required">
        <input type="text" name="firstName" class="form-control" ng-model="Addressid.nameFirst" ng-minlength="3" placeholder="First Name" required>
        <div ng-messages="rmaForm.firstName.$error">
            <div ng-message="required">
                Please enter your first name
            </div>
        </div>
    </div>
</div> 

CSS

.required:after { content:" *"; }

问题

我知道如何在标签后添加星号，但我希望它在输入字段后。目前它在第二个 div 中的错误消息之后。 CSS 是否可以在输入字段后获取它？

Answer 1

例如你可以这样做

.required:after {
  content: " *";
  position: absolute;
  top: 30px;
  left: 190px;
}

( demo )

或者您只需在输入后添加一个新的 span 并将星号放入:

<input type="text" name="firstName" class="form-control" ng-model="Addressid.nameFirst" ng-minlength="3" placeholder="First Name" required>
<span class="required-field">*</span>