この２つのcssの記述のちがいは何ですか？→「div.class{}」「.class div{}」

Question

div.class{}

.class div{}

上記２つの違いを、できれば例を出して教えていただけませんでしょうか。

Answer 1

<section class="class">
  <div> <!--.class div-->
    <div></div> <!-- こちらも.class div-->
  </div>
</section>

<div class="class"></div> <!-- div.class-->

Answer 2

<!-- div.class{} = クラス名が「class」のdiv-->
<div class="class">このdivに対してスタイルが効く</div>

は

<!-- .class div{} = クラス名「class」の中のdiv-->
<div class="class"> <!-- ここはdivじゃなくてもクラス名が「class」であればいいです -->
    <div>このdivに対してスタイルが効く</div>
<div>

です。

HTMLとCSSなら、ここで聞いてもいいですが実践しながらやったほうがよりわかりやすいですよ。