Лабораторная работа № 1
Задание 1. Создание простейших файлов HTML
Чтобы создать свой файл HTML, сделайте следующее:
1. Создайте папку HTML, в которой мы будем сохранять созданные Web-страницы.
2. Запустите стандартную программу Блокнот (Notepad).
3. Наберите в окне редактора простейший текст файла HTML:
<HTML>
<HEAD>
<TITLE> Учебный файл HTML </TITLE>
</HEAD>
<BODY>
Расписание занятий на вторник
</BODY>
</HTML>
4. Сохраните файл под именем RASP.HTM.
5. Для просмотра созданной Web-страницы загрузите браузер Microsoft Internet Explorer.
6. Откройте в меню браузера Файл (File), Открыть (Open), Просмотр(Обзор - Browse) и найдите в папке KURS файл RASP.HTM и загрузите его. Убедитесь, что название Web-страницы (Учебный файл HTML) отразилось в верхней статусной строке браузера.
Задание 2. Управление расположением текста на экране
Информация.
При отображении HTML-документов браузеры автоматически размещают текст на экране, не принимая во внимание встречающиеся в файле переводы строк и идущие подряд пробелов.
1. При необходимости выполните п.п. 5-6 задания 1.
2. Откройте первоисточник Web-страницы – в меню браузера Вид (View), Источник (В виде HTML) откроется окно со стандартной программой Блокнот (Notepad), в котором ваша Web-страница представлена в командах HTML.
3. Внесите изменения в текст файла HTML, расположив слова "Расписание", "занятий", "на вторник" на разных строках:
<HTML>
<HEAD>
<TITLE> Учебный файл HTML </TITLE>
</HEAD>
<BODY>
Расписание
Занятий
На вторник
</BODY>
</HTML>
4. Сохраните внесенные изменения в файле RASP.HTM, с помощью команд Файл (File), Сохранить (Save). Закройте программу Блокнот (Notepad).
5. Просмотрите с помощью браузера Microsoft Internet Explorer новую полученную Web-страницу используя клавишу F5 или с помощью команд Вид(View), Обновить (Refresh). Изменилось ли изображение текста на экране?
Примечание
В дальнейшем после внесения изменений в Web-страницу всегда выполняйте п.п.4-5.
Задание 3. Тэги перевода строки и абзаца
Информация.
Существуют специальные команды, выполняющие перевод строки и задающие начало нового абзаца. Кроме того, существует команда, которая запрещает программе браузера каким-либо образом изменять форматирование текста и позволяет точно воспроизвести на экране заданный фрагмент текстового файла.
Тэг перевода строки <BR> отделяет строку от последующего текста или графики. Тэг абзаца <P> тоже отделяет строку, но еще добавляет пустую строку, которая зрительно выделяет абзаца. Оба тэга являются одноэлементными.
1. Внесите изменения в текст файла HTML:
<HTML>
<HEAD>
<TITLE> Учебный файл HTML </TITLE>
</HEAD>
<BODY>
Расписание <P>
занятий <BR>
на вторник
</BODY>
</HTML>
2. 4. Сохраните внесенные изменения в файле RASP.HTM.
6. Просмотрите с помощью браузера Microsoft Internet Explorer новую полученную Web-страницу. Как изменилось изображение текста на экране?
Задание 4. Выделение фрагментов текста
Информация.
Тэги выделения фрагментов текста позволяют управлять отображением отдельных символов и слов. Существует три тэга выделения фрагментов текста:
<B> … </B> для выделения полужирным,
<I> … </I> для выделения курсивом,
<U> …</U> для выделения подчеркиванием.
1. Внесите изменения в файл RASP.HTM:
<HTML>
<HEAD>
<TITLE> Учебный файл HTML </TITLE>
</HEAD>
<BODY>
<B> Расписание </B><I> занятий </I> <U> на вторник </U>
</BODY>
</HTML>
2. Посмотрите новую полученную Web-страницу.
Возможно использование комбинированных шрифтов:
<I><B> Расписание </B></I> <I>занятий</I> <U> на вторник</U>
Но при этом необходимо помнить следующее правило записи комбинированных тэгов:
<Тэг-1> <Тэг-2> … </Тэг-2> </Тэг-1> | правильная запись |
<Тэг-1> <Тэг-2> … </Тэг-1> </Тэг-2> | ошибочная запись |
Задание 5. Использование стилей заголовка
Информация.
Существует два способа управления размером текста, изображаемого браузером:
· использование стилей заголовка,
· задание размера основного документа или размера текущего шрифта.
Используется шесть тэгов заголовков (от Н1 до Н6). Каждому тэгу соответствует конкретный стиль, заданный в параметрах настройки браузера. Стиль Н1 – самый крупный.
1. Внесите изменения в файл RASP.HTM:
<HTML>
<HEAD>
<TITLE> Учебный файл HTML </TITLE>
</HEAD>
<BODY>
<H1> Расписание </H1><I> занятий </I> <U> на вторник </U>
</BODY>
</HTML>
2. Посмотрите новую полученную Web-страницу.