CSSクラスのネスト？

Question

だから、いくつかの角度とCSS上に読んで、私は、これは私はそれがcss-formクラスの中にネストされた入力要素を選択するが、何何かがdiv.aか何かのように持っていたときのことだということを知って

.css-form input.ng-invalid.ng-touched { color: whatever; } 

を意味し、正確に何を忘れてしまったら？それはクラスaのdivというだけですか？

私は

は、この呼び出しである、これはクラスng-invalidとng-touchedを持っている（それは見た目ほど、彼らは、角度によって自動的に設定されているように見える、あなたが実際に括弧に入れないでください）inputだろう推測しています入れ子について正しい？

ありがとうございました。

Answer 1

「CSSセレクタ」とは、スタイルを設定する要素を選択するためのパターンです。

div.aは、あなたが完全な詳細についてはw3school - CSS Selectorsを参照することができclass="a"

を持つすべての要素を選択し、その説明できます。

Answer 2

.css-form input.ng-invalid.ng-touched { color: whatever; } 

このセレクタは言っている：

クラス属性は、次の2つの 値が含ま

目標入力要素：

• ng-invalid
• ng-touched

を

<form class="css-form"> 
    <input class="ng-invalid"> 
    <input class="ng-touched"> 
    <input class="ng-invalid ng-touched"> 
    <input type="submit"> 
</form> 

上記CSSルールのみinput三分の一を標的とする。また

は、入力がクラスで要素 css-form

サンプルHTMLの子孫でなければなりません。

クラスセレクタは、連鎖している（つまり、タッチしていなければならない）ことに注意してください。空白の文字が1つでもあれば、代わりに子孫セレクタになります。

.css-form input.ng-invalid .ng-touched { color: whatever; } 

このセレクタは言う：クラスcss-form持つ要素の子孫であるクラスng-invalid有する入力要素の子孫であるクラスng-touchedと

標的要素。

（ "入力要素の子孫.." LOL。私は知っている。それは単なる例であり、我々はCSSを話している、それは遅く、私はポイントを作ろうとしている！;-)

W3C参考文献：

• 6.4. Class selectors
• 8.1. Descendant combinator