What does the :target pseudo-class represent?

Q: What does the :target pseudo-class represent?

The `:target` pseudo-class in CSS represents an element whose id matches the fragment identifier (hash) in the current URL. It allows you to style elements when they are the target of a link. `:target` applies styles only when the element's id matches the URL hash (e.g., `#section1`). It is often used for highlighting sections, creating tabbed interfaces, or simple in-page navigation effects. Only one element can be targeted at a time since a URL can have only one fragment identifier. /* Normal section style */ section { padding: 10px; border: 1px solid #ccc; margin: 10px 0; transition: background-color 0.3s; } /* Highlight the targeted section */ section:target { background-color: lightblue; border-color: steelblue; } Go to Section 1 | Go to Section 2 Section 1 Content Section 2 Content In this example, when you click a link pointing to `#section1` or `#section2`, the corresponding section becomes the target and is highlighted using the `:target` pseudo-class. Use `:target` to highlight or animate elements when navigated via fragment identifiers. Combine with transitions for smooth visual feedback. Avoid relying solely on `:target` for critical functionality, as the effect depends on the URL fragment. Test across browsers, as some older browsers may have limited support.

Difficulty: 3/10

CSS pseudo-classes, anchor link targeting, UI state styling

Understanding the :target Pseudo-Class in CSS

The :target pseudo-class in CSS represents an element whose id matches the fragment identifier (hash) in the current URL. It allows you to style elements when they are the target of a link.

Key Points About :target

1
:target applies styles only when the element's id matches the URL hash (e.g., #section1).
2
It is often used for highlighting sections, creating tabbed interfaces, or simple in-page navigation effects.

What does the :target pseudo-class represent?

Difficulty: 3/10

CSS pseudo-classes, anchor link targeting, UI state styling

Understanding the :target Pseudo-Class in CSS

The :target pseudo-class in CSS represents an element whose id matches the fragment identifier (hash) in the current URL. It allows you to style elements when they are the target of a link.

Key Points About :target

1
:target applies styles only when the element's id matches the URL hash (e.g., #section1).
2
It is often used for highlighting sections, creating tabbed interfaces, or simple in-page navigation effects.

What does the :target pseudo-class represent?

Understanding the :target Pseudo-Class in CSS

What does the :target pseudo-class represent?

Understanding the :target Pseudo-Class in CSS

Scenario Questions

Follow-up Questions