Упражнение 19.1. Создание простейшей Web-страницы

<213 214 215216217 218 219 >

1.Запустите текстовый редактор Блокнот(Пуск > Программы > Стандартные > Блокнот).

2.Введите следующий документ:

<HTML>

<HEAD> <Т1Т1Е>Заголовок документа</Т1Т1Е>

</HEAD>

<BODY>

Содержание

документа

</BODY> </HTML>

3. Сохраните этот документ под именем first.htm.

Перед сохранением убедитесь, что сброшен флажок Не показывать расширения для зарегистрированных типов файлов (Пуск > Настройка > Свойства папки > Вид). В противном случае редактор Блокнот может автоматически добавить в конец имени расширение .ТХТ.

4.Запустите программу Internet Explorer (Пуск > Программы > Internet Explorer).

5.Дайте команду Файл > Открыть. Щелкните на кнопке Обзор и откройте файл first.htm.

6.Посмотрите, как отображается этот файл — простейший корректный документ HTML. Где отображается содержимое элемента TITLE? Где отображается содержимое элемента BODY?

7.Как отображаются слова «Содержание» и «документа», введенные в двух отдельных строчках? Почему? Проверьте, что происходит при уменьшении ширины окна.

В этом упражнении мы создали простейший документ HTML Мы познакомились с особенностями форматирования документов HTML и их отображения при помощи обозревателя Internet Explorer.

Упражнение 19.2. Изучение приемов форматирования абзацев

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

3. Удалите весь текст, находящийся между тегами <BODY> и </BODY>. Текст, который будет вводиться в последующих пунктах этого упражнения, необходимо поместить после тега <BODY>, а его конкретное содержание может быть любым.

4. Введите заголовок первого уровня, заключив его между тегами <Н1 > и </Н1 >.

5. Введите заголовок второго уровня, заключив его между тегами <Н2> и </Н2>.

6. Введите отдельный абзац текста, начав его с тега <Р>. Пробелы и символы перевода строки можно использовать внутри абзаца произвольно.

7. Введите тег горизонтальной линейки <HR>.

8. Введите еще один абзац текста, начав его с тега <Р>.

9. Сохраните этот документ под именем paragraph.htm.

10.Запустите обозреватель Internet Explorer (Пуск > Программы > Internet Explorer).

10.Дайте команду Файл > Открыть. Щелкните на кнопке Обзор и откройте файл paragraph.htm.

11.Посмотрите, как отображается этот файл. Установите соответствие между элементами кода HTML и фрагментами документа, отображаемыми на экране.

В этом упражнении мы создали документ HTML с разметкой абзацев. Мы определили, как влияют теги HTML на отображение соответствующих частей документа.

Упражнение 19.3. Создание гиперссылок

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

2. Удалите весь текст, находящийся между тегами <BODY> и </BODY>. Текст, который будет вводиться в последующих пунктах этого упражнения, необходимо поместить после тега <BODY>.

3. Введите фразу: Текст до ссылки.

4.Введите тег: <А HREF="first.htm">.

5. Введите фразу: Ссылка.

6. Введите закрывающий тег </А>.

7. Введите фразу: Текст после ссылки.

8. Сохраните документ под именем link.htm.

9.Запустите обозреватель Internet Explorer (Пуск > Программы > Internet Explorer).

10.Дайте команду Файл > Открыть. Щелкните на кнопке Обзор и откройте файл link.htm.

11.Убедитесь в том, что текст между тегами <А> и </А> выделен как ссылка (цветом и подчеркиванием).

12.Щелкните на ссылке и убедитесь, что при этом загружается документ, на который указывает ссылка.

13.Щелкните на кнопке Назад на панели инструментов, чтобы вернуться к предыдущей странице. Убедитесь, что ссылка теперь считается «просмотренной» и отображается другим цветом.

В этом упражнении мы создали документ HTML, содержащий гиперссылки. Мы увидели, как гиперссылки отображаются в документе, и научились пользоватьтся ими.

Упражнение 19.4. Создание изображения и использование