Селектор тэгов, который мы с вами рассмотрели в предыдущем видео - это, конечно, хорошо. 

Но, как быть, если мы хотим, чтобы стили CSS применялись не ко всем элементам, а каким-то определенным?

В этом случае к нам может прийти на помощь селектор классов. 

Давайте добавим для каких-то определенных абзацев атрибут class со значением red. 

Например:

<p class="red">Абзац</p>

Теперь, для того, чтобы сказать, что тем элементам, у которых имеется атрибут class со значением red, нужно воспользоваться специальным селектором, который называется селектор классов.

В CSS, для того, чтобы указать название класса как селектор, перед ним ставиться знак точки ".".

Знак точки означает, что этим селектором мы будем с вами обращаться к тем элементам, которые имеют атрибут class.

И после знака точки указывается то значение атрибута class у элемента, к которому будут применяться свойства CSS.

Например, можно записать так:

.red {color:red}

В документе можно создавать сколько угодно селекторов по классу. Давайте, например также изменим цвет текста элементов у которых атрибут class равен yellow.

.red {color:red}
.yellow {color:yellow;}

Использовать селектор по атрибуту class - это намного более гибкое решение по выборке нужных элементов, по сравнению с тем же самым селектором тэгов.

Селектор классов может нам значительно упростить работу со стилями CSS.