Простые селекторы CSS
Синтаксис задания правила CSS
Правила CSS
Таблица стилей состоит из правил CSS. Каждое правило задается с использованием следующего синтаксиса:
селектор { блок-объявлений },
где блок-объявлений содержит одно или несколько объявлений стилей. Объявления в списке отделяются друг от друга символом ";", перед которым и после которого может следовать произвольное количество пробельных символов. Параметр селектор может быть простым или составным.
В качестве простого селектора в правиле CSS могут задаваться следующие селекторы:
· селектор типа;
· универсальный селектор;
· селектор класса;
· селектор id;
· селектор атрибута;
· псевдоклассы;
· псевдоэлементы.
В селекторах типа, в качестве значения селектора задается имя элемента HTML.
Пример 4.3.15. Задание селектора типа:
h1 {color: red; font-size: 18pt;
font-weight: bold; text-align: center},
В соответствии с этим правилом CSS все заголовки первого уровня в Web-странице будут выводиться красным цветом, размером 18 пунктов, полужирным шрифтом и выровнены по центру, например, для фрагмента документа HTML
|
|
<h1>Раздел 1</h1>
вывод Web-страницы будет иметь следующий вид:
Если какое-либо правило необходимо применить ко всем элементам документа, в качестве селектора задается символ "*", называемый универсальным селектором.
Пример 4.3.16. Задание универсального селектора:
* {color: green}
В соответствии с этим правилом CSS содержимое всех элементов-контейнеров Web-страницы будет выведено зеленым цветом, например, для фрагмента документа HTML
<h1>Раздел 1</h1>
<p>Абзац 1</p>
вывод Web-страницы будет иметь следующий вид: