Способы задания стилевых правил

ЛАБОРАТОРНАЯ РАБОТА

Тема: Основы использования стилей для оформления html-документов

Цель работы: Освоить основные приемы описания и использования стилевых свойств

Способы задания стилевых правил

Стилевые правила для документа и его элементов могут определяться тремя основными способами: в подключаемом внешнем файле, в глобальной таблице стилей документа, непосредственно в элементе с помощью атрибута style.

В конце лабораторной работы приведена необходимая справочная информация.

ЗАДАНИЕ 1(Три способа задания стилевых правил)

При выполнении задания 1 в документе необходимо использовать все три способа описания стилевых правил.

1. Создать стилевой файл style.css, в котором определить стилевой класс main, определяющий следующие свойства:

семейство шрифтов: Arial,

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

начертание шрифта: полужирный (bold).

2. Создать пустой html-документ 1.htm. Подключить к нему стилевой файл. В теле документа определить два элемента div:

· первый — без атрибутов и с текстом "Без оформления" ,

· второй — со стилевым классом main и текстом "Стиль описан во внешнем файле".

Изучить, как браузер отображает оба текстовых сообщения.

3. Создать в заголовочной части файла 1.htm глобальную таблицу стилей, в которой определить стилевой класс global со свойствами:

семейство шрифтов: Tahoma,

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

тип шрифта: курсив (italic).

Добавить в тело документа два элемента div:

· один связать со стилевым классом global и поместить в него текст "Оформление из глобальной таблицы стилей".

· во второй поместить текст "Оформление задано в элементе" и определить стилевые свойства непосредственно в элементе с помощью атрибута style:

семейство шрифтов: Сourier,

размер шрифта: 14px.

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