Изменение размера шрифта

Тема 6 практических занятий: Каскадные таблицы стилей. Часть 2.

Справочные материалы: Основы языка HTML и введение в CSS и JavaScript   + -

Замечание 1: Каскадными таблицами стилей (Cascade Style Sheets) - называются шаблоны, управляющие форматированием тэгов языка HTML в WWW-документах.

Замечание 2: Создать в личной папке каталог (папку) bg и заполнить его фоновыми рисунками из папки bg. Сами рисунки можно посмотреть по Ссылке на фоновые рисунки.

Замечание 3: Создать в личной папке каталог (папку) CSS и заполнить этот каталог файлами с расширением .css из папки CSS.

Замечание 4: Сохранить в личной папке файлы   Class.htm и DetiShm.htm.


Подтема 1. Классы стилей

1. Откройте WWW страницу Class.htm и перейдите к виду в кодах HTML.

2. Cвязать страницу со стилевым файлом Class.css в папке CSS. Вставить в файл Class.htm перед тэгом </HEAD> строку
<link rel="stylesheet" type="text/css" href="CSS/class.css">

3. Посмотреть как будет выглядеть страница после вставки ссылки на стилевой файл.

4. Открыть стилевой файл Class.css в блокноте (NotePad) и создать новые классы H1.green и H1.darkblue по образцу класса H1.red. Измените размеры шрифта в классах H1.green и H1.darkblue на 30pt и 48pt соответственно. 

5. Вставить строчки class=green и class=darkblue к свободным тэгам <H1>. Протестировать изменения на странице Class.htm.

6. Создать новые классы   .right и .justify по образцу класса .center. Добавить параметры class=right и class= justify   к свободным тэгам <P> и <H1>. Изменить цвет и размер шрифта в этих классах по сравнению с классом .center.
Примечание: класс, задаваемый именем с лидирующей точкой, без указания конкретного элемента, может применяться к любым элементам документа
)

7. Создать новый класс .myclass с размером шрифта 18pt, выравниванием по центру, темно-зеленого цвета и полужирного (Font-weight: 700) начертания и оформить с помощью этого класса текст между тэгами   <H2> и </H2> и последние абзацы текста  (тэг<P>).

Подтема 2. Оформление больших документов с помощью каскадных таблиц стилей

1. Откройте страницу DetiShm.htm.

2. Разберитесь в его устройстве, перейдя к просмотру документа в виде HTML кодов.

3. Измените в документе DetiShm.htm цвет шрифта на красный (#FF0000), а размер на 10pt с помощью стилевого файла Text.css   (класс P.normal) в папке CSS.

4. Просмотреть изменения в документе в результате правки стилевого файла.