Селекторы id и class в CSS, что это такое? В CSS существует возможность обратиться к элементам html-документа по значению его атрибутов. CSS позволяет указать свои собственные селекторы, которые называются «id» и «class». Эти селекторы позволяют применять свойства CSS к элементам определенного блока страницы. К примеру, можно присвоить класс всем ссылкам в блоке навигации и другой класс блоку содержимого страницы. Далее можно присвоить различный стиль ссылкам в блоке навигации и блоке контента.

Селектор id

Селектор id предназначен для определения стиля для одного, уникального элемента страницы. Данный селектор использует атрибут «id» и определяется знаком «#».

Пример. Зададим стили для абзаца:

<p id="primer">Пример селектора id.</p>

Стили имеют следующий вид:

#primer {
text-align:center;
color:red;
}

К данному абзацу будет применен стиль «primer». Таким образом, текст абзаца у нас будет выравниваться по центру, цвет у него будет красный.

Селектор class

Селектор class используется для определения стиля у группы элементов. Данный селектор использует атрибут «class» и определяется знаком «.»

Рассмотрим пример:

<h1 class="center">Текст заголовка</h1>
<p class="center">Текст абзаца...</p>

Используемые стили:

.center {
font-family: Verdana, Helvetica, sans-serif;
font-size: 12px;
color:red;
}

Таким образом, из урока мы  познакомились с селекторами id и class в CSS, и на практических примерах научились с ними работать. Эти селекторы очень часто используются на практике, поэтому знать о их существовании крайне необходимо.