CSS Selectors are the core of Cascading Style Sheets. They allow you to target specific HTML elements on your web page and apply styles to them. Understanding the basic selectors—Universal, Type, Class, and ID—is the first step to mastering CSS layout and design.

1. Universal Selector (*)

The universal selector matches every single element on the page. It is denoted by an asterisk *. It is often used for resetting margins and padding, but should be used sparingly for complex properties due to performance implications.

2. Type Selector (Element)

The type selector matches elements by their node name (tag name). For example, p selects all paragraph elements, and h1 selects all level 1 headings. This is useful for setting site-wide defaults.

3. Class Selector (.)

The class selector matches elements that have a specific class attribute. It is denoted by a dot . followed by the class name (e.g., .button). Classes are reusable, meaning you can use the same class on multiple elements.

4. ID Selector (#)

The ID selector matches an element based on the value of its id attribute. It is denoted by a hash # followed by the ID name (e.g., #header). IDs must be unique per page; only one element can have a specific ID.