Quiz

1. Can we do a little demo of the inheritance of styles? It didn't come as intuitive for me. Thanks!

   Sure. Let's use this page, and we can add a style to BODY and UL and this LI. We'll add border and color.

2. Could you please elaborate more on overriding in CSS?

   Sure. We can add a background color to this UL and a different one to this LI

3. Are there any specific CSS declarations whose inherited/not-inherited status we should be aware of?

   Every CSS property is either inherited or not. If you're puzzled or unsure, you can check on MDN. I honestly have never found it to be surprising.

4. what is the difference between child and descendant? / Could we talk more about the difference between descendant and child selectors please? Thank you! / What is the difference between parent-child relationships and ancestor-descendant relationships? / Difference between child vs. descendant?

   Okay, let's take a very specific example from the real world. My father's name is Sandy. My son is Ross. The following are all true:

   • Ross is Scott's child
   • Scott is Sandy's child
   • Ross is *not* Sandy's child
   • Ross is Scott's descendant
   • Scott is Sandy's descendant
   • Ross is Sandy's descendant

   In the world of CSS, let's look at this element.

   • the P starting "Okay," is a child of the DIV (so is the UL)
   • The DIV is a child of the LI
   • The P and UL are descendants but not children of the LI
   • etc
5. When is it appropriate to use a parent-child relationship vs ancestor-descendant relationship?

   The parent-child is more specific. I tend to use it when I want to control the children of some particular thing, but not any unanticipated descendants.

   Most of the time, I use descendants, just because it's easier.

6. I am not too sure on the application of A~B for the structural selectors.

   I've almost never used it. I find ancestor relationships more important than siblings, but I can imagine others think differently.

7. Can you give another example of using descendants for efficiency? / Can you go over structural selectors with more examples?

   If I want all the hyperlinks in the NAV section to look different from normal links, I would use:

   
       nav a {
           text-decoration: none:
           color: black;
           display: block;
       }
   
   

   Or some such.
8. For the last example in the Siblings section, why is div a sibling with the rest of the tags? Shouldn’t it be the parent of those or am I just not understanding the whole descendant selectors concept correctly?...

   You're correct, but you misread what I wrote. The section is sibling. The H2, P and UL are all siblings. They are *in* the DIV. (children of it).

9. Why are colors determined by different amounts of red, blue, and green instead of red, blue, and yellow? Pixels are also colored by different amounts of RBG as well, right?

   Correct. Yellow is one of the *subtractive* primaries: when you are mixing paint. The *additive* primaries are for when you are mixing *light*. Those primaries are RGB.

10. which way is better to specify colors? RGB or hex value?

    Makes no difference. Hex value is older, so it might be the only supported way on a very old browser.

11. Other ways to specify colors besides RGB?

    Yes, but we won't get into them unless you want me to.

12. How do the computers understand :hover? How do they match where the mouse is on?

    The computer is constantly tracking the mouse. It gives the coordinates to the browser, which determines what elements the mouse is over, and applies CSS if necessary.