Ход работы. Упражнение 1. Создание простейшей Web-страницы
Упражнение 1. Создание простейшей Web-страницы Запустите текстовый редактор Блокнот (Пуск > Программы > Стандартные > Блокнот). Введите следующий документ: <НТМL> <HEAD> <ТIТLЕ>Заголовок документа< /ТIТLЕ> </HEAD> <BODY> Содержание документа </BODY> </HTML> Сохраните этот документ под именем first.html.
Перед сохранением убедитесь, что сброшен флажок - Не показывать расширения для зарегистрированных типов файлов (Пуск > Настройка > Свойства папки > Вид). В противном случае редактор Блокнот может автоматически добавить в конец имени расширение ТХТ. Запустите программу Internet Explorer (Пуск > Программы > Internet Explorer). Дайте команду Файл >Открыть. Щелкните на кнопке Обзор и откройте файл first.html. Посмотрите, как отображается этот файл — простейший корректный документ HTML. Где отображается содержимое элемента TITLE? Где отображается содержимое элемента BODY? Как отображаются слова «Содержание» и «документа», введенные в двух отдельных строчках? Почему? Проверьте, что происходит при уменьшении ширины окна. Упражнение 2. Изучение приемов форматирования абзацев. Если это упражнение выполняется не сразу после предыдущего, откройте документ first, html в программе Блокнот. Удалите весь текст, находящийся между тегами <BODY> и </BODY>. Текст, который будет вводиться в последующих пунктах этого упражнения, необходимо поместить после тега <BODY>, а его конкретное содержание может быть любым. Введите заголовок первого уровня, заключив его между тегами <Н1 > и </Н1 >. Введите заголовок второго уровня, заключив его между тегами <Н2> и </Н2>. Введите отдельный абзац текста, начав его с тега <Р>. Пробелы и символы перевода строки можно использовать внутри абзаца произвольно. Введите тег горизонтальной линейки <HR>. Введите еще один абзац текста, начав его с тега <Р>. Сохраните этот документ под именем paragraph. html. Запустите обозреватель Internet Explorer (Пуск > Программы > Internet Explorer). Дайте команду Файл > Открыть. Щелкните на кнопке Обзор и откройте файл Посмотрите, как отображается этот файл. Установите соответствие между элементами кода HTML и фрагментами документа, отображаемыми на экране. В этом упражнении вы создали документ HTML с разметкой абзацев. Определите, как влияют теги HTML на отображение соответствующих частей документа. Упражнение 3. Создание гиперссылок Если это упражнение выполняется не сразу после предыдущего, откройте документ first, html в программе Блокнот. Удалите весь текст, находящийся между тегами <BODY> и </BODY>. Текст, который будет вводиться в последующих пунктах этого упражнения, необходимо поместить после тега <BODY>. Введите фразу: Текст до ссылки. Введите тег: <А HREF="first html.">. Введите фразу: Ссылка. Введите закрывающий тег </А>. Введите фразу: Текст после ссылки. Сохраните документ под именем link.. html Запустите обозреватель Internet Explorer (Пуск > Программы > Internet Explorer). Дайте команду Файл > Открыть. Щелкните на кнопке Обзор и откройте файл link.. html Убедитесь в том, что текст между тегами <А> и </А> выделен как ссылка (цветом и подчеркиванием). Щелкните на ссылке и убедитесь, что при этом загружается документ, на который указывает ссылка. Щелкните на кнопке Назад на панели инструментов, чтобы вернуться к предыдущей странице. Убедитесь, что ссылка теперь считается «просмотренной» и отображается другим цветом.
Контрольные вопросы. 1. Перечислить назначение элементов: <BODY>, <STYLE>, <META>, <HEAD>, <A> <|/a>, <BASE> 2. Понятие гипертекстовые ссылки, атрибуты. Содержание отчета. 1. Название и цель работы. 2. Краткие сведения по теории и порядку выполнения работы. 3. Выводы по работе.
ЛАБОРАТОРНАЯ РАБОТА №15
|