Селектор дар CSS чист?

Селектор дар CSS — шаблон, ки муайян мекунад, ки ба кадом элементҳои HTML истифода мешаванд. Он браузерро нишон медиҳад, ки кадом як ё чанд элемент бояд интихоб шаванд.

Маҳз намудҳои гуногуни селекторҳо мавҷуданд:

Селекторҳои намуд (Type selectors): ҳамаи намунаҳои элементҳои HTML-ро интихоб мекунанд.
```
p { /* ҳамаи параграфҳоро интихоб мекунад */
  color: blue;
}
```
Селекторҳои синф (Class selectors): элементҳоро бо арзиши муайяни атрибути class интихоб мекунанд.
```
.highlight { /* ҳамаи элементҳоро бо синфи "highlight" интихоб мекунад */
  background-color: yellow;
}
```
Селекторҳои ID (ID selectors): танҳо як элементро бо арзиши муайяни атрибути id интихоб мекунад.
```
#header { /* элемент бо id "header" интихоб мекунад */
  font-size: 2em;
}
```

Селекторҳои умуми (Universal selector): ҳамаи элементҳоро интихоб мекунад.

* { /* ҳамаи элементҳоро дар саҳифа интихоб мекунад */
  margin: 0;
  padding: 0;
}

Селекторҳои атрибутҳо (Attribute selectors): элементҳоро дар асоси мавҷуд будан ё арзиши атрибутҳои онҳо интихоб мекунанд.
```
[type="text"] { /* ҳамаи input-ҳоро бо type="text" интихоб мекунад */
  border: 1px solid gray;
}
```

Псеудокласҳо (Pseudo-classes): элементҳоро дар асоси ҳолати онҳо интихоб мекунанд.

a:hover { /* дар ҳоле ки нишона дар ҳоли ҳаракат аст, интихоб мекунад */
  text-decoration: underline;
}

Псеудоэлементҳо (Pseudo-elements): қисми муайяни элементро интихоб мекунанд ё "фиктив" элементҳо месозанд.
```
p::first-line { /* нахустин сатрро интихоб мекунад */
  font-weight: bold;
}
```

Комбинаторҳо (Combinators): муносибатҳои байни селекторҳоро муайян мекунанд.

Комбинатор	Тавсиф	Мисол
Прост ( ( ) )	Селектор фарзандон (Descendant selector)	`div p`
`>`	Селектор фарзандони (Child selector)	`div > p`
`+`	Селектор ҳамсояи наздик (Adjacent sibling selector)	`h1 + p`
`~`	Селектор ҳамсояи умумӣ (General sibling selector)	`h1 ~ p`

Селекторҳо метавонанд дар якҷоягӣ барои муайян кардани дақиқтар элементҳо истифода шаванд.