CSS .class Selector
Example
Select and style all elements with class="intro":
.intro {
background-color: yellow;
}
Try it Yourself »
More "Try it Yourself" examples below.
Definition and Usage
The .class selector selects elements with a specific class attribute.
To select elements with a specific class, write a period (.) character, followed by the name of the class.
You can also specify that only specific HTML elements should be affected by a class. To do this, start with the element name, then write the period (.) character, followed by the name of the class (look at Example 1 below).
HTML elements can also refer to more than one class (look at Example 2 below).
| Version: | CSS1 |
|---|
Browser Support
| Selector | |||||
|---|---|---|---|---|---|
| .class | Yes | Yes | Yes | Yes | Yes |
CSS Syntax
More Examples
Example 1
Style all <p> elements with class="hometown":
p.hometown {
background-color: yellow;
}
Try it Yourself »
Example 2
This <p> element will be styled according to class="center" AND to class="large":
<p class="center large">This paragraph refers to two classes.</p>
Try it Yourself »
