Каскадные таблицы стилей CSS. Захаркина В.В. - 8 стр.

UptoLike

ВУЗ: 

СПбГУ | Санкт-Петербург

Составители: 

Рубрика: 

14
h1 { font-size: 24px }
h1 { color: red }
h1 { border: black thin dotted }
равносилен одному:
h1 { font-size: 24px; color: red;
border: black thin dotted }
Селекторы
Простой селектор представляет собой либо селектор типа, либо
селектор класса, за которым могут следовать селекторы
псевдоклассов, id-селекторы и селекторы атрибутов (о них в
данном кратком описании умолчим).
Селектор - это последовательность простых селекторов, разделенных
пробелами, либо символами + и < .
Селекторы можно группировать, разделяя запятыми. Например,
следующая последовательность одинаковых объявлений
h1 { color: navy }
h2 { color: navy }
h3 { color: navy }
Равносильна
h1, h2, h3 { color: navy }
Селекторы типа
Селектор типа представляет собой название типа элемента документа,
в котором используются каскадные таблицы стилей. Для HTML-
документа селектор типа - это имя HTML-элемента.
15
body { font-size: 12px }
h1 { font-size: 24px; color: red;
border: black thin dotted }
На примере селекторов типа рассмотрим более изощренные
возможности, связанные с использованием контекста.
Селекторы потомков
Можно применять к HTML-элементу определенный стиль в
зависимости от того, вложен ли этот элемент в другой. Для этого
названия элементов перечисляются в порядке их предполагаемой
вложенности и разделяются пробелами. В следующем примере
описывается селектор, согласно которому содержимое элемента
strong будет выведено красным цветом только внутри ячеек таблиц:
td strong { color: red }
Дочерние селекторы
В следующем примере правила стиля будут применены только к
элементам em, являющимися дочерними для div.
div > em { font-size: 12px }
Сестринские селекторы
В следующем примере правила стиля будут применены только к тем
элементам h1 и h2, которые являются дочерними дочерними одного
и того же родительского элемента в дереве документа, и h1
непосредственно предшествует h2.
h1 + h2 { text-indent: 0 }

Страницы