Types of selectors in css

• Universal selector

• Individual selector

• class and id selector

• and selector

• inside an element

• direct child

• sibling selector

• Universal selector

Universal selector is used to select all the elements. this selector all elements in page.

Syntax *{ colour: Red; }

• Individual selector

  Individual selector are used to select a specific html tag on which we need to apply style. this is most used selector in css.

Syntax p{ style properties }

• Class and Id selector

  class selector selects all elements which matches the class attribute. using this syntax we can select all the html elements having the same class.

Syntax .heading{color: red;}

ID selector Id selector selects an element as per the value of its id attribute. in a html document there should be only unique value of an id attribute.

Syntax

#paragraph{color : red;}

• And selector

  And selector can be used in multiple ways, that is using . we can select that specific element.

Syntax .class1.class2{ color : red; }

• Inside an element

  inside an element typically represented by a single space (" ") character — combines two selectors such that elements matched by the second selector are selected if they have an ancestor element matching the first selector.

Syntax div ul { color : red; }

• Direct child

  The direct child (>) is placed between two CSS selectors. It matches only those elements matched by the second selector that are the direct children of elements matched by the first.

Syntax div>li { color: red; }

• Sibling selector

  The adjacent sibling selector (+) is placed between two CSS selectors. It matches only those elements matched by the second selector that are the next sibling element of the first selector. If you want to select siblings of an element even if they are not directly adjacent, then you can use the general sibling combinator (~).