Web Programming with HTML5, CSS, and JavaScript

4.3 Descendant Selectors

A descendant selector is when you specify a series of two or more selectors separated by spaces. For each pair of adjacent selectors, the browser searches for a pair of elements that match the selectors such that the second element is contained within the first element’s start tag and end tag. When an element is inside another element’s start tag and end tag, we say that the element is a descendant of the outer element.

To better understand the descendant selector, let’s look at an example. The following structure shows how the Work Day web page’s ul and li elements are related:

The ul element at the top is for the ...