Классы CSS

Для определения селектора класса в CSS перед названием класса ставится точка:

	.redBlock{
	background-color:red;
	}
	
Название класса может быть произвольным. Например, в данном случае название класса - "redBlock". Для имен используются буквы, числа, дефисы и знаки подчеркивания, причем начинать название класса должно обязательно с буквы.

Также стоит учитывать регистр имен: названия "article" и "ARTICLE" будут представлять разные классы.

После определения класса мы можем его применить к элементу с помощью атрибута class.
Например:

<div class="redBlock"></div>

Определим и используем несколько классов:

Классы CSS

CSS3

Селекторы

Группа селекторов

Некоторый текст...

код

CSS:

<style>
div{
	width: 50px;
	height: 50px;
	margin: 10px;
}
.redBlock{
	background-color: red;
}
.blueBlock{
	background-color: blue;
}
h1, h2, h3, h4{

color: red;
}
</style>

HTML:


<h2 style="color:green">Классы CSS</h2>
<div class="redBlock"></div>
<div class="blueBlock"></div>
<div class="redBlock"></div>
<h1>CSS3<h1>
<h2>Селекторы</h2>
<h3>Группа селекторов</h3>
<p>Некоторый текст...</p>