Functional differences between these two choices of CSS selector...(my take)

body

• Applies style properties to body element.
• Elements within body may inherit the property values. Some properties default to 'inherit'.
• Style declarations that match an element within body can override the inherited style.

The Universal Selector * (all elements)

• Applies style properties to all individual elements.
• Replaces inherited style properties, and default 'initial values'. Blocks inheritance.
• Other, more specific css selectors that match an element will replace the style properties applied by *.

Suggestions

1. Use body for style properties that default to inherit, such as font, color, in order to provide a sensible default value for elements, reducing the need to explicitly code for every case, and preserving the ability for elements contained at lower levels below body to inherit from their parents.
2. Probably better not to use the Universal Selector * in this case. It interrupts inheritance between other elements within body, and may force you to write more css rules to compensate. It can be a factor in slowing rendering of pages. This depends on the size and content of the page and how many css rules there are.

Background / Depth

Elements contained in body may inherit style properties from their parent element, or receive them through the CSS Cascade. If neither of these methods provide a value, each property retains its initial (i.e. default) value.

Inheritance and The Cascade are different mechanisms. Inheritance is a fairly simple and quick mechanism whereby property values are carried down to contained elements.

The Cascade is a complex process with the purpose of finding the best matching CSS rule (if any) to define each style property for each element. It involves evaluating selectors that match each element and sorting those selectors by selectivity (specially defined), order of declaration, and some other factors.

Functional differences between these two choices of CSS selector...(my take)

body

• Applies style properties to body element.
• Elements within body may inherit the property values. Some properties default to 'inherit'.
• Style declarations that match an element within body can override the inherited style.

The Universal Selector * (all elements)

• Applies style properties to all individual elements.
• Replaces inherited style properties, and default 'initial values'. Blocks inheritance.
• Other, more specific css selectors that match an element will replace the style properties applied by *.

Suggestions

1. Use body for style properties that default to inherit, such as font, color, in order to provide a sensible default value for elements, reducing the need to explicitly code for every case, and preserving the ability for elements contained at lower levels below body to inherit from their parents.
2. Probably better not to use the Universal Selector * in this case. It interrupts inheritance between other elements within body, and may force you to write more css rules to compensate. It can be a factor in slowing rendering of pages. This depends on the size and content of the page and how many css rules there are.