CSS descendant selector exceptions - css

Question

I read about the difference between descendant and child selectors and thought I had understood it but kept getting the same result whether I would use the first or the latter.
It took me a while to understand that there are exceptions to the rule and it's not always true that you don't target descendant tags when you would use child selectors. I don't know if I am wrong here but it seems that you have to have chosen a style on your descendent tags or you will still target the descendent tags even if you use child selectors.
Here is an example where I get the same result no matter what I use:
ul#firstUl > li{
color:red;
background-color: lightblue;
}
<div >
<ul id="firstUl">
<li> Child </li>
<li> Child </li>
<li> Child </li>
<li>
<ul>
<li> Descendant </li>
</ul>
</li>
</ul>
</div>
As I have understood, the li tag with the text 'Descendant' should not had been targeted here but it is. So am I right that if the descendent tags haven't already been altered, you target them as well?

Answer 1

Interesting question.
So basically you're defining a color red for a li element. This color will be applied to all the element into the li. So the rule is applying correctly, however, setting up a default value (as I did below) will fallback to the black as soon as we're getting out of the scope of your css rule.
li {
color: black;
}
ul#firstUl > li {
color:red;
background-color: lightblue;
}
<div >
<ul id="firstUl">
<li> Child </li>
<li> Child </li>
<li> Child </li>
<li>
<ul>
<li> Descendant </li>
</ul>
</li>
</ul>
</div>