Question

我在https://angular.io/docs/ts/latest/guide/forms.html

中找到了关注CSS

.ng-valid[required], .ng-valid.required  {
  border-left: 5px solid #42A948; /* green */
}
.ng-invalid:not(form)  {
  border-left: 5px solid #a94442; /* red */
}

之前我没有看过.ng-valid[required]语法。我猜.ng-valid是一个班级。 [required]是一些新的CSS语法吗？

Answer 1

使用CSS attribute selector *[required]，您可以使用属性required格式化元素。语法不是新的。请参阅以下示例：

input[required] {
  border:1px solid red;
}

<input type="text" required/>
<input type="text"/>

这在<form>中经常用于根据需要定义<input>之类的元素。使用CSS属性选择器*[required]，您可以格式化这些必需的元素。

您还可以使用:required伪类来格式化所需的元素：

input:required {
  border:1px solid red;
}

<input type="text" required/>
<input type="text"/>

:required CSS伪类表示设置了<input>属性的任何required元素。这样，表单可以在提交表单之前轻松指出哪些字段必须包含有效数据 来源： https://developer.mozilla.org/en-US/docs/Web/CSS/:required

'required'css选择器语法

1 个答案: