'必要' CSSセレクタの構文

Question

は私が前に.ng-valid[required]構文を見ていないhttps://angular.io/docs/ts/latest/guide/forms.html

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

で、次のCSSを発見しました。私は.ng-validがクラスだと思います。 [required]は新しいCSS構文ですか？

Answer 1

CSS attribute selector*[required]を使用すると、属性requiredで要素を書式設定できます。構文は新しいものではありません。次の例を参照してください：

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

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

これは、多くの場合、必要に応じて<input>のようないくつかの要素を定義するために<form>秒で使用されています。 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