Наследование селекторов

Наследование – это перенос правил форматирования для элементов, находящихся внутри других. Например, для параграфа P задано форматирование, а для курсива I, который находится внутри параграфа, нет. В этом случае вложенный элемент наследует свойства родительского элемента.

Пример. Наследование селекторов
<html>
<head>
<style type="text/css">
P { text-align: justify; color: black; }
B { font-weight: bold; color: navy; }
</style>
</head>

<body>
<p>Перед началом работы проверьте наличие оборудования входящего в комплект <b>ЭВМ</b>. При отсутствии одного или нескольких периферийных устройств следует сразу же обратиться к техническому персоналу <b>ВЦ</b>. После осмотра визуальными методами своего рабочего места <i>можно осторожно включить питание</i> <b>ЭВМ</b>.</p>
</body>
</html>

Перед началом работы проверьте наличие оборудования входящего в комплект ЭВМ. При отсутствии одного или нескольких периферийных устройств следует сразу же обратиться к техническому персоналу ВЦ. После осмотра визуальными методами своего рабочего места можно осторожно включить питание ЭВМ.

В примере используются разные параметры форматирования для тегов P и B. Как бы вы эти теги не сочетали друг с другом, вид их, заданный в стиле, не изменится. Другое дело тег курсива I. В стиле он не указан, поэтому некоторые свойства, такие как цвет, он наследует от тега параграфа, внутри которого находится.

Наследование полезно для задания свойств, применяемых к элементу по умолчанию. Например, достаточно задать параметры форматирования тега TABLE и к ячейкам таблицы они будут применены автоматически. Точно так же можно определить свойства тега BODY, который порождает все остальные элементы веб-страницы.

<style type="text/css">
BODY { text-align: justify; color: black; font-family: Arial; }
</style>

Приведенный в примере код задает форматирование для всех элементов веб-страницы по умолчанию.




Рекомендуем почитать

 

Добавить комментарий


Ваше имя:


Комментарий:


Введите: Картинка