What are some examples of CSS selectors?

What are some examples of CSS selectors?

CSS selectors are patterns used to select elements on a webpage. Here are a few examples:

1. Element Selector: div selects all <div> elements.
2. Class Selector: .className selects all elements with the class 'className'.
3. ID Selector: #idName selects the element with the ID 'idName'.
4. Attribute Selector: [type='text'] selects all input elements with type 'text'.
5. Pseudo-class Selector: a:hover selects links when hovered over.

Can you explain the difference between class and ID selectors?

Sure! Class selectors (e.g., .className) can be used on multiple elements, while ID selectors (e.g., #idName) should be unique and used on only one element per page. This makes IDs more specific than classes.

What about pseudo-elements?

Pseudo-elements are used to style specific parts of an element. For example, ::before can insert content before an element's content, and ::after can insert content after. They are useful for adding decorative elements without additional HTML.

Can you give me an example of using a pseudo-class?

Certainly! A common pseudo-class is :nth-child(n), which selects elements based on their order. For example, li:nth-child(2) selects the second <li> in a list.