A CSS selector is the part of a CSS rule set that actually selects the content you want to style.
Consider some types of CSS selectors:
- Universal selector: *
- Element type selector: ul,td
- ID Selector: #id
- Class selector: .box
- Descendant combinator: #id .box. The .box element doesn’t have to be an immediate child of #id.
- Child combinator: #id > .box. Unlike the descendant combinator, there can’t be another element wrapping .box
- General Sibling Combinator: ~
- Adjacent Sibling Combinator: +. The difference from general sibling combinaltor is that the targeted element must be an immediate sibling, not just a general sibling.
- Attribute Selector: input[type="text"]
- Pseudo-class: a:hover. A pseudo-class uses a colon character to identify a pseudo-state that an element might be in.
- Pseudo-element: .container::before. This selector inserts an imaginary element into the page, inside the targeted element, before its contents.
 
