Читайте также:
|
|
Все объявления стилей называются правилами (rules):
h1 {color:red}
Правило состоит из двух частей:
· селектор (h1) определяет html-тэг (заголовок, абзац и т. д.);
· определение (color:red) устанавливает стиль, применяемый к данному селектору (тэгу).
Определение, в свою очередь, тоже состоит из двух частей: свойства (color) и значения (red). Определения записываются в фигурных скобках {…} и отделяются друг от друга точкой с запятой. Свойства и некоторые значения определены в спецификации стилевых таблиц.
Замечание. Обратите внимание, что селекторы пишутся без угловых скобок. Довольно распространёнными ошибками у начинающих являются записи вида <h1> {color:red} или <h1 {color:red}>.
Для уменьшения размеров таблицы можно группировать несколько селекторов и определений в одном правиле. Селекторы группируются через запятую (,), определения – через точку с запятой (;). Например:
h1, h2 {color:red; font-style:italic; font-family:Arial}
В данном примере задаётся одинаковое определение для заголовков первого и второго уровня: они будут иметь красный цвет, курсивное начертание и шрифт Arial, оставаясь при этом различных размеров (соответствующих размерам заголовков первого и второго уровня по умолчанию), так как размер шрифта (свойство font-size) в определении не указан.
С помощью таблиц стилей можно отменить жирное начертание у заголовков, заданное в браузерах по умолчанию: h1, h2 {font-weight: normal}. Тэги физического выделения (<b>, <i>, <font> и т.д.) не позволят вам этого сделать.
Подробный список часто используемых свойств стилевых таблиц приведён в прил. 3.
Наследование
Наследованием в CSS называется свойство вложенного тэга наследовать свойства своего родительского тэга. В предыдущих примерах мы определили для тэга <h1> красный цвет. Допустим, на вашей веб-странице внутри <h1> встречается курсивное выделение <i>:
<h1>Пример <i>наследования</i> свойств родительского элемента</h1>
Какого цвета будет слово «наследования»? Правильный ответ – красного. Так как мы не определили цвет для тэга <i>, он унаследует свойство от родительского тэга, в данном случае – от <h1>.
Поскольку все элементы, отображаемые в окне браузера, вложены в тэг <body>, от него наследуют свойства все остальные тэги. Таким образом, имеет смысл определить стиль по умолчанию для всего документа, например:
body {color: black; bgcolor: lightgreen; font-family: Arial}
а затем по мере необходимости добавлять стили для разных тэгов.
Дата добавления: 2015-07-26; просмотров: 109 | Нарушение авторских прав
<== предыдущая страница | | | следующая страница ==> |
Таблицы в HTML | | | Приоритет применения таблиц стилей |