html5,css3について

何年か前にhtmlコーディングをしていました。
４時間パートになって時間ができたので、もう一度と思い始めたのですが、お手本のスタイルシートに以前なかったものが入っていました。

[class^="box"],
div:not([class])
{
｝

body > div:not([class]) {min-height: 200px}

[class^="box"] > *:not([class^="box"]) {
｝

[class^="box"] > [class^="box"],
div:not([class]) > div:not([class])
{
｝

[class^="box"] > [class^="box"] > [class^="box"]
{
｝

[class^="box"] > [class^="box"] > [class^="box"] > [class^="box"]
{
｝
私がcssで苦戦して設定いたものが、一発で解決して、残りはhtmlのstyleだけでokでした。
これが何なのか教えていただきたいんです。
こんなに便利なものは今すぐに覚えたいと思います。
宜しくお願いします。

No.1 ベストアンサー 回答者： fujillin 回答日時： 2018/08/16 15:16

こんにちは。

例示のなかのどのあたりがわからないのかが不明ですが・・・

例えば、
「>」は、結合子のうちの子結合子といわれるものです。
https://developer.mozilla.org/ja/docs/Web/CSS/Ch …

「[～～]」は、属性セレクタと言われるものです。
https://developer.mozilla.org/ja/docs/Web/CSS/At …

他にもいろいろありますので、以下のサイト等をざっと目を通しておくのがよろしいかと思います。
https://developer.mozilla.org/ja/docs/Web/CSS/Re …

この回答へのお礼

以前簡単なコーディングを習ってから、会社が変わりもうできないとあきらめていました。
まず、教科書を手当たり次第にやってみようと思いましたが、疑問点にぶつかると相談する人がいなくて、今回思い切って質問してみました。
親切に教えて下さり、ありがとうございます。

お礼日時：2018/08/16 15:55