--- title: "target selector" url: https://weworkworldwide.com/tutorials/target-selector-2/ description: "When we want to apply a CSS style to an element that its ID appears in a URL, we use this type of selector. Note: when the ID of an element appears in a UR" date: 2026-09-29T09:00:03+00:00 source: https://weworkworldwide.com/llms.txt --- # target selector ``` line-numbers ``` When we want to apply a CSS style to an element that its ID appears in a URL, we use this type of selector. Note: when the ID of an element appears in a URL, that element is called the target element. Example: ``` line-numbers CSS is fun :)

header

I'm the first of type p element in this div container

One of many

``` In the example above, any p element that its ID appears in the URL is considered to be the target element. ``` line-numbers ``` As the picture above shows, in this example I have select the “Target the paragraph three” link and as the result of this link selection, the ID of the third paragraph appears in the URL, so now this paragraph is the target and the CSS style of the “p:target” selector applies to this element. We could be more general and style any element that its ID appears in the URL with only using “:target” as the selector. Example: ``` line-numbers CSS is fun :)

Target the header
Target the paragraph two
Target the list item one
Target the list item two

I'm the first of type p element in this div container

List Item one
List Item two

```