Комбинатор е нещо, което обяснява връзката между селекторите. Един селектор в CSS, може да съдържа повече от един прост селектори. Те се свързват помежду си със комбинатори. Има четири различни комбинатора в CSS3. В следващият HTML списък са представени тези, които ще разгледаме в този урок.
Descendant Selector
В този селектор съвпадат всички елементи, които са „потомци“ (вложени) в даден елемент. Следващият пример избира всички <p> елементи вътре <div> елементи:
Child Selector
Този селектор прихваща всички HTML елементи, които са преки потомци на дадения. Следващият пример избира всички <p> елементи, които са преки деца на <div> елемент:
Adjacent Sibling Selector
Този селектор се използва за избиране на всички съседни елементи на даден елемент. Sibling елементи трябва да имат един и същ основен елемент, а „съседен“ означава „непосредствено след“. Следващият пример избира всички <p> елементи, които са поставени веднага след <div> елементи:
General Sibling Selector
Този селектор избира всички, елементи, които са siblings на даден елемент. Следващият пример избира всички <p> елементи, които са siblings на <div> елементи: