Can CSS Select Parent Elements Based on Their Child Elements?

Answer:

Unfortunately, CSS2 and CSS3 specifications lack the ability to select parent elements based on their child content. Parent selectors are not currently supported.

Note on Specification Updates:

This information may become outdated due to ongoing discussions and changes in CSS specifications. We will make every effort to keep this answer accurate, but inaccuracies may occur.

Exploring Parent Selectors in CSS Drafts:

An early "Selectors Level 4 Working Draft" introduced the concept of "selector subjects," allowing authors to specify the element that receives styles. However, this feature has been removed from future specifications and will not be available.

The :has() Pseudo-Class in "Selectors Level 4 Editor's Draft":

A more recent "Selectors Level 4 Editor's Draft" includes the :has() relational pseudo-class. This construct allows for element selection based on their content. Using :has(), the example above appears as follows:

p:has(span) {
    color: red;
}

This selector will select all

elements that contain a child.

The above is the detailed content of Can CSS Select Parent Elements Based on Their Child Elements?. For more information, please follow other related articles on the PHP Chinese website!