Why are spaces used to separate things in css

Here is something in a wordpress stylesheet that I don't understand:

blockquote cite,
blockquote em,
b开发者_Python百科lockquote i {
font-style: normal;
}

what does the space between blockquote and cite do? I understand if they are separated by a comma, then both blockquote and cite will have "font-style: normal;" now they are separated by space, does this mean if a blockquote tag is embedded into a cite tag it will get "font-style: normal;"?

Thank you.

The space is known as the descendant combinator. blockquote cite selects any cite element within a blockquote element. Likewise for blockquote em and blockquote i.

In other words, it's not "if a blockquote tag is embedded into a cite tag", it's the other way around (besides, you can't place blockquotes in cites in the first place).

As you note, commas group selector sequences into the same rule.

This means target the cite tag inside the blockquote etc.

In this instance, the site is attempting to override all italics set inside a blockquote.

A space between selectors will cause the style sheet to apply the rule selectively. A space is the descendant selector or combinator. It applies to any descendant element within the descender.

A rule of blockquote cite { font-style: normal; } would only apply the font style to both item 1 and item b. Both item 1 and item b are descendants of item A. item A will not get the rule.

 A. item A (Blockquote)
   1. item 1 (Cite)
     a. item a
     b. item b (Cite)
   2. item 2

This is slightly similar to the > selector. That is the child selector. It applies to any child of an element. A child is a 1st level descendant. In the table above with rule blockquote > cite { font-style: normal; } instead, item b would not get the font-style rule applied, as it is a 2nd level descendant, hence not a child. item A would also not get rule.

If you want both blockquote and any cite within blockquote to get the rule, they must both be listed:

blockquote, blockquote cite { font-style: normal; }