html - css セレクター: 「body h1」、「body .h1」、「body.h1」の違い

Question

このcssルールが適用される要素を理解しようとしています:

body h1, body .h1 {
    font-family: 'Open Sans', sans-serif !important;
    color: inherit;
    text-rendering: optimizelegibility;
}

わかりますbody.h1が、わかりませbody h1んbody .h1

score 8 · Accepted Answer

body h1<h1>-element 内のすべての -element をアドレス指定します<body>。

<body>
    <h1>This one</h1>
    <div>
        <h1>And also this one</h1>
    </div>
</body>

body .h1クラス を持つボディ内のすべての要素を選択しますh1：

<body>
    <h1 class="h1">This one</h1>
    <div class="h1">And also this one</div>
</body>

body.h1<body>class がある場合、最後に -element 自体のスタイルを設定しh1ます。

<body class="h1"></body>

score 0 · Accepted Answer

body h1:h1要素の子孫であるすべてのbody要素

body .h1h1: 要素の子孫であるクラスを持つすべてのbody要素

5 に答える 5