Selector in CSS differences

Question

What’s the difference between:

.figure-box>figure>img{
    width: 440px;
    position: relative;
}

To:

.figure-box figure img{
    max-width: 100%;
    position: relative;
    transition: transform 0.6s;
}

Answer 1

.A>.B>.C will select C who is B’s immediate son who is A’s immediate son

.A .B .C will select C and B for any offspring

Answer 2

The difference is that with the > means that the Elemental has to be direct child, for ex:

<div class="figure-box">
   <div><div><div><div>
      <figure>
         <div>
            <img src=""/>
         </div>
      </figure>
   </div></div></div></div>
</div>

For this HTML tree, the .figure-box figure img, but the .figure-box > figure > img, for the figure is not the direct son of .figure-box

And for selector without >, this condition of direct child is independent