Правила каскадирования

Если на один и тот же элемент распространяют действие определений стилей, то приоритеты определяются по следующим двум признакам.

а) Более конкретное правило всегда имеет более высокий приоритет. Например, стилевые свойства, заданные для конкретного элемента (селектор — идентификатор элемента), имеют преимущества перед свойствами, определенными стилевым классом (это более общий селектор).

б) Из трех возможных способов задание стилевых правил самый высокий приоритет имеют свойства, определенные в элементе, а наименьший — во внешнем файле.

ЗАДАНИЕ 2(Правила каскадирования)

1. Создать файл 2.htm нового html-документа.

Подключить к документу стилевой файл style.css из задания 1. В этот стилевой файл добавить два правила

а) для элемента с идентификатором elem:

размер шрифта: 24px,

цвет шрифта: зеленый (green или #00FF00).

б) всех элементов <p>:

размер шрифта: 40px,

2. Добавить в заголовочную часть документа 2.htm таблицу глобальных стилей, в которую поместить стилевое правило, распространяющееся на все элементы <p>:

размер шрифта: 18px,

цвет шрифта — голубой (blue или #0000FF).

3. В тело html-документа добавить три элемента <p> :

<p id="elem">Первый элемент</p>

<p>Второй элемент</p>

<p>Третий элемент</p>

4. Добавить определение стиля непосредственно в третий элемент <p>:

размер шрифта: 24px,

цвет шрифта — красный (red или #FF0000).

5. Загрузить документ и объяснить форматирование вывода, выполненное браузером.

6. В первом элементе <p> изменить значение идентификатора (например, на elem0) и перезагрузить файл документа. Что изменилось в отображении документа и почему?

7. В глобальной стилевой таблице документа закомментировать определение стиля для всех элементов <p> и перезагрузить документ. Что изменилось в отображении документа и почему?