Селекторы классов
Селекторы классов CSS выбирают элементы на HTML-странице, если у них есть атрибут с именем класс, значение которого совпадает с именем селектора класса .
В документе таблицы стилей имени селектора класса предшествует точка (например, «. «).
Если селектор класса объединен с другим или несколькими селекторами типа или класса, селекторам класса должна предшествовать точка.
На HTML-странице любое количество элементы могут иметь одинаковое значение атрибута класса.
синтаксис:
.classname {CSS-Property: value; ........................}
Простой пример селекторов классов CSS
Код CSS:
.w3r {color: red; /* устанавливает красный цвет */background-color: aliceblue; /* устанавливает цвет фона на aliceblue */}
HTML code:
Простой пример селекторов классов CSS Lorem ipsum dolor sit amet, conctetur adipiscing elit. Сделано элитная урна.
Целое число malesuada tempus enim nec rhoncus. Aenean tempus adipiscing porttitor.
Результат:
Lorem ipsum dolor sit amet, conctetur adipiscing elit. Donec a urna elit.
Целое число malesuada tempus enim nec rhoncus. Aenean tempus adipiscing porttitor.
Просмотрите этот простой пример селектора классов CSS в отдельном окне браузера.
Расширенный пример селекторов классов CSS
CSS-код:
.w3resource {color: red; /* устанавливает красный цвет */background-color: aliceblue; /* устанавливает цвет фона на aliceblue */}. w3resource1 {font-weight: bold; /* устанавливает полужирный размер шрифта */font-variant: small-caps; /* устанавливает для шрифтов маленькие заглавные буквы */}
HTML code:
Расширенный пример селекторов классов CSS Мы изучаем селектор классов CSS в w3resource.
Мы изучаем селектор классов CSS в w3resource.
Результат:
Мы изучаем селектор классов CSS в w3resource.
Мы изучаем селектор классов CSS в w3resource.
Просмотреть это расширенный пример селектора классов CSS в отдельном окне браузера.