Element selectors are the most basic type of CSS selectors.
They select HTML elements by their tag name.
What Is an Element Selector
An element selector targets all elements of a specific type.
This selector styles every paragraph on the page.
Common Element Selectors
Some common element selectors include:
- h1
- p
- div
- span
- body
When to Use Element Selectors
Use element selectors when you want to:
- Style all elements of the same type
- Apply global styles
Here, different styles are applied to different elements.
Advantages of Element Selectors
- Easy to use
- Quick to apply
- Good for base styles
Limitations of Element Selectors
- They style all matching elements
- Not useful when you need different styles for similar elements
Element Selectors in Real Projects
Developers use element selectors to set default styles such as:
- Font family
- Base text color
- Page background
Why This Matters for Jobs
Understanding element selectors helps you:
- Write clean base styles
- Build consistent layouts
- Work faster on new projects
Common Beginner Mistakes
- Using element selectors when class selectors are needed
- Over-styling with element selectors
Practice Task
Create a small CSS file and:
- Style all headings
- Style all paragraphs
- Change the background of the page
What You Will Learn Next
In the next lesson, you will learn how to use class selectors.