CSS Class Selectors: The '.' Prefix
Learn how to use class selectors to efficiently style multiple HTML elements in CSS.
Styling Groups: Class Selectors
Class selectors are like team jerseys for your HTML elements. You can give a group of elements the same "jersey" (a class) and then style all of them at once!
The Dot '.' Syntax
The basic syntax for selecting a class in CSS is: .class-name { property: value; }. You must always start with the dot (`.`) to tell the browser you're targeting a class.
The Power of Reusability
Class selectors are the workhorses of CSS. Their main advantage is **reusability**. You can apply the same class to any number of elements—paragraphs, divs, spans, etc.—to give them a consistent style. This keeps your code organized and easy to update.
Practice Zone
Interactive Test 1: Drag & Drop
Arrastra en el orden correspondiente.
Arrastra las opciones:
Completa el código:
Interactive Test 2: Fill in the Blanks
Rellena los huecos en cada casilla.
.important-text { color: ; font-weight: ; }
Practice Example: Code Editor
Write a CSS rule to make all elements with the class .important have a font-weight of bold.