CSS :target-within Selector

❮ Previous Selectors Next ❯

Experimental: This is an experimental technology.

Example

article:target-within {
  background-color: gold;
}

/* Add a pseudo-element inside the target element */
p:target::before {
  font: 70% sans-serif;
  content: "►";
  color: limegreen;
  margin-right: 0.25em;
}

/* Style italic elements within the target element */
p:target i {
  color: red;
}

Meaning

The :target-within selector represents an element that is a target element or contains an element that is a target.

A target element is a unique element with an id matching the URL's fragment.

In other words, it represents an element that is itself matched by the :target pseudo-class or has a descendant that is matched by :target.

Version: CSS3




Standard Syntax

:target-within {
  css declarations;
}



Browser Support

The numbers in the table specify the first browser version that fully supports the property.




Status







❮ Previous Selectors Next ❯