Parents, Children, Ancestors, and Descendents

Often, when discussing the relationships of elements to one another we use the terms "parent", "child", "ancestor", and "descendent" to discuss their relationship. This will come up in general discussion and also when we get into some more advanced CSS.

Parent
The immediate enclosing element. e.g. <head> and <body>'s parent is <html>. Nothing inside either has <html> as a parent.
Child
An immediate enclosed element. e.g. <title> is a child of <head>, but not <body>.
Ancestor
Any element that encloses another, inner, element is an ancestor of that element, no matter how much nesting. Parents are Ancestors with only one level of nesting.
Descendent
Any element inside another element, no matter how many layers of nesting. is a descendent of the outer element. A Child of an element is also a Descendent, though the inverse is not necessarily true.
Back to Knowledge Dump