From the course: CSS Essential Training

Unlock this course with a free trial

Join today to access over 25,600 courses taught by industry experts.

Combinators and selector lists

Combinators and selector lists

From the course: CSS Essential Training

Start my 1-month free trial Buy for my team

Combinators and selector lists

“

- [Narrator] When writing HTML, tags are nested inside other tags, creating a family tree-like structure called the document object model. The terminology to describe these relationships between the elements is pretty much the same as how we describe family relationships. The ancestor is the containing element while all elements nested within are the descendants. Elements nested directly at the first level also form a parent-child relationship. When referring to the child elements in relation to each other, they are called sibling elements. CSS combinators are used to select elements based on their location in the DOM. Let's start by taking a look at the most commonly used combinator, the descendant combinator, represented by a single space. It's used to match to elements based on the ancestor-descendant relationship. The first selector targets an ancestor element, while the second targets a descendant. Let's see how…

Contents