Заголовки

Спецификация HTML позволяет программисту использовать шесть различных стилей, или логических уровней заголовков. Для того чтобы отобразить заголовок на web-странице, необходимо использовать тег <Нn>, где n — целое число от 1 до 6, обозначающее номер уровня заголовка, где самым верхним уровнем принято считать 1.

Синтаксис записи этой команды в общем виде таков:

<Нn АLIGN="параметр">Текст заголовка</Нn>

Атрибут ALIGN дает возможность web-мастеру определить расположение заголовка в окне броузера. Параметр этого атрибута может принимать одно из трех возможных значений: RIGHT, LEFT, CENTER. Вот пример использования данного тега:

<Н1 ALIGN="CENTER">ДOБPO ПОЖАЛОВАТЬ НА МОЮ СТРАНИЧКУ! </Н1>

Не рекомендуется включать в документы заголовки ниже уровня <Н4>, поскольку они отображаются значительно более мелким шрифтом, нежели основной текст web-страницы, что затрудняет восприятие информации. Во всех остальных случаях использование данной команды — дело вкуса и эстетических предпочтений автора проекта.

Задания для практического занятия:

1. Создайте новую директорию (папку) на жестком диске компьютера и назовите ее, например, «Site_vasha_familiya». Внутри этой папки создайте каталог с названием «images», туда вы будете впоследствии помещать иллюстрирующие ваш проект изображения.

2. В созданном вами файле с помощью программы Блокнот запишите следующий текст:

1

3. Вставьте в код своей страницы текст комментария, например предупреждение об авторских правах.

4. Создайте заголовок первого уровня (тег <H1>) и «отцентрируйте» его.

5. Создайте маркированный (<ul> <li> </li> </ul>) и нумерованный (<ol> <li> </li> </ol>) списки.

Виды операционных систем:

1. Unix

2. Linux

3. FreeBSD

4. OS/2

5. MacOS

6. VMSP5

7. SunOS

8. VMESA

9. Windows

Активный контент:

o Java

o ActiveX

o JavaScript

o VBScript

o Action Script

o Coockies

6. Создайте гипертекстовую ссылку (тег <a href="/"> </a>) с последнего пункта нумерованного списка.

7. Поместите изображение на страницу (тег <img src="/" />).

8. Сделайте размещенное изображение ссылкой (тег <a href="/"> </a>).

9. Еще раз разместите это же изображение на странице, и также сделайте его гипертекстовой ссылкой. Добейтесь, чтобы рамка вокруг изображения не была видна. Отцентрируйте изображение и текст под ним.

10. Сделайте задний фон страницы светло-желтым __ (#FFFFD9),
цвет непосещенных ссылок – красным __ (#FF0000),
посещенных – синим __ (#0000FF).

11. В нумерованном списке текст пункта 4 сделайте жирным (теги <strong> </strong>и <b> </b>), а пункта 5 - курсивным (наклонным) (теги <em> </em>и <i> </i>).

12. Оформите в абзац (тег <p> </p>) текст, предстваленный ниже. Словосочетание «гипертекстовая ссылка» оформите зеленым цветом (#008000)__

Что такоегипертекстовая ссылка(или, как чаще говорят, просто ссылка)?
С помощью ссылки устанавливается связь с другим (или с тем же) документом. Ссылкой может быть фрагмент текста или изображение. По умолчанию текстовая ссылка подчеркнута. При подведении курсора мыши к гипертекстовой ссылке он превращается в раскрытую ладонь. При нажатии на ссылку браузер обращается к серверу, запрашивая документ, который указан в html-теге ссылки.

13. Создайте абсолютную ссылку на сайт www.mail.ru

Для поиска информации воспользуйтесь поисковой машиной www.mail.ru

14. Сохраните страницу в личной папке в файл firstpage.html

Контрольные вопросы

1. Дайте определение понятия тег.

2. Структура HTML-документа.

3. Какие виды тегов вы знаете?