Универсальный селектор
Универсальный селектор позволяет установить общие параметры форматирования для всех документа.
* {
font-size: 12pt;
font-family: Arial;
}
5.1. (X)HTML-теги.
Любой (X)HTML-теги могут быть использованы в качестве селектора. Таким образом возможно указывать параметры форматирования конкретного тега. Но при этом следует учитывать специфику тега. Например, тег <br /> не содержит текст, следовательно, к нему невозможно применить правила для установки шрифта или цвета.
Синтаксис:
тег { свойство1: значение1;
свойство2: значение2;
…
свойствоN: значениеN; }
Пример:
CSS:
* {
font-family: Arial;
color: blue;
}
h1, h2, h3, h4, h5, h6 {
font-family: Times New Roman;
color: red;
align: center;
text-align: center;
}
strong {
color: green;
}
HTML:
…
<body>
Просто текст
<h1>Заголовок первого уровня</h1>
<p>Текст <strong>абзаца</strong></p>
</body>
Свойства, установленные для тегов наследуются. Например, если установить для тега body шрифт Arial и синий цвет, то этот стиль будет применен и для всех тегов, которые находятся внутри тега body. Передача свойств вложенным элементам продолжается до тех пор, пока это свойство не будет переопределено.
При создании страниц часто приходится вкладывать одни теги внутрь других. CSS позволяет устанавливать форматирование для тега, который вложенный в другой тег:
<тег1>
<тег2>Текст</тег2>
</тег1>
Для того, что бы установить форматирование для тега2, который вложен в тег1 следует применять такую конструкцию:
тег1 тег2 { свойство1: значение1;
свойство2: значение2;
…
}
Примеры.
HTML:
<body>
<p>
<h1>
<strong>Текст1</strong>
</h1>
</p>
<h1>
<strong>Текст2</strong>
</h1>
</body>
CSS:
body { color: blue; }
p h1 strong { color: red; }
Классы, определяемые пользователем
Классы применяются, когда необходимо определить стиль для индивидуального элемента веб-страницы или задать разные стили для одного тега.
Синтаксис:
Тег.Имя класса { свойство1: значение; свойство2: значение; ... }
Имя класса выбирается произвольно.
Для того, чтобы применить описанный класс к тегу, следует добавить к соответствующему тегу параметр class=”Имя класса”.
Синтаксис:
<тег class=”Имя класса”>…</тег>
Пример.
CSS позволяет определять классы, которые можно применять к любому тегу (X)HTML. Синтаксис описания такого класса:
.Имя класса { свойство1: значение; свойство2: значение; ... }
Пример.
5.3. Идентификаторы, определяемые пользователем
Идентификатор (ID-селектор) определяет уникальное имя элемента, которое используется для установки оформления этого элемента.
Каждый идентификатор может встречаться на странице только один раз.
Синтаксис:
#идентификатор { свойство1: значение1; свойство2: значение2; … }
Дата добавления: 2015-03-14; просмотров: 469;