---
title: Class Selector
---
## Class Selector
A Class Selector is used in a CSS file to apply style to the HTML elements with the corresponding class name. In HTML, you can set the class name for any element by adding a `class` attribute.
To select elements with a specific class, we use a (.) named as period character, with the name of the class.
For example
.center {
text-align: center;
color: red;
}
Here, all HTML elements with `class="center"` will be red and center-aligned.
Examples:
```html
This is a heading 1
This is a paragraph 1
This is a heading 2
This is a paragraph 2
This is a div 1
```
Since a class name is not unique, the HTML class attribute makes it possible to define equal styles for elements with the same class name. **Here is how you can select class in a CSS file to style elements (notice the . notation):**
**All elements of class `test` will be applied with this style:**
```css
.test {
color: green;
}
```
**All `` elements of class `test` will be applied with this style:**
```css
p.test {
border: 1px solid black;
color: red;
}
```
**All `
` and `` elements of class `test` will be applied with this style:**
```css
h1.test, h2.test {
color: blue;
}
```
**All elements which have both class `test2` and `test3` will be applied with this style:**
```css
.test2.test3 {
color: green;
}
```
**Tips: No space between multiple classes.**
#### More Information:
CSS Syntax and Selectors: w3schools