Лабораторная работа №12. «Основы работы с языком html»
Цель: ознакомиться с основой создания веб-страницы на языке HTML.
Задачи:
Изучить структуру документа HTML.
Освоить самостоятельно создание документа HTML в программе «Блокнот».
Краткая теория по теме:
Документ HTML состоит из основного текста документа и тегов разметки, которые, как мы уже знаем, являются наборами обычных символов. Таким образом, документ HTML - это, по существу, обычный текстовый файл. Для его создания можно использовать любой текстовый редактор, хотя бы и тот простейший редактор Блокнот, который входит в состав Windows.
1. Все документы HTML имеют строго заданную структуру. Документ должен начинаться с тега <HTML> и заканчиваться соответствующим закрывающим тегом </HTML>. Эта пара тегов сообщает браузеру, что перед ним действительно документ HTML.
2. Документ HTML состоит из раздела заголовков и тела документа, идущих именно в таком порядке. Раздел заголовков заключен между тегами <НЕАD> и </НЕАD> и содержит информацию о документе в целом. В частности, этот раздел должен содержать внутри себя теги <ТIТLE> и </ТIТLE>, между которыми размещают «официальный» заголовок документа. Большинство браузеров, работающих в системе Windows, используют этот заголовок, чтобы заполнить строку заголовка окна браузера.
3. Сам текст документа располагается в теле документа. Тело документа располагается между тегами <BODY> и </BODY>.
Четыре перечисленных парных тега определяют основную структуру документа HTML. Они встречаются (или их наличие подразумевается) во всех документах HTML.
На практике определить местоположение этих основных структурных тегов можно и при их отсутствии. Поэтому, если теги < HTML>, <HEAD> и <BODY>, а также соответствующие им закрывающие теги опущены, то программа -браузер может сама определить то место где они должны были находиться. Тег <ТIТLE>, определяющим заголовок документа, считается обязательным, но и его пропуск не вызовет катастрофических последствий в современных браузерах. Но все-таки при создании Web-страниц опускать все эти теги не рекомендуется, ведь заранее не известно, как поведет себя конкретный браузер, установленный на компьютере читателя.
Вот как это документ выглядит при просмотре с помощью браузера Internet Ехрlогег
Задание 1.
1. Откройте программу Блокнот (Пуск –Программы –Стандартные –Блокнот).
2. Напишите следующий текст:
<HTML>
<HEAD>
<TITLE>Главная страница</TITLE>
</HEAD>
<BODY>
<H1> <center>Учебный ресурс для студентов .. курса отделения ...</center> </H1>
<H2> Автор: должность, звание, ФИО </H2>
<P>Этот сайт содержит материалы, необходимые для подготовки к занятиям, зачету и экзамену.
<P>Здесь Вы найдете материалы лекций, практических занятий, вопросы к зачету, а также дополнительный материал
</BODY>
</HTML>
Теги <H1> </H1> и <H2> </H2> соответственно заголовки 1-го и 2-го уровней.
Тег <center>текст</center> позволяет выровнять текст, помещенный внутри него, по центру страницы.
Тег <p> указывает на новый абзац.
Сохраните документ в своей папке:
Файл –Сохранить Как …
Укажите свою папку
Дайте имя файлу index.html
4. Откройте файл с помощью Internet Explorer и просмотрите результат.
Задание 2. Используя электронный учебник, самостоятельно создайте страницу содержащую:
1. Картинку с альтернативным текстом.
2. Гиперссылки на сайт www.tolgas.ru и на свою почту.
3. Семь разных стилей шрифта (семь разных пословиц, которые надо оформить разными цветами, размером и видом шрифта).
4. Таблицу содержащую 2 столбца и 4 строки.
Вопросы для самоконтроля:
Почему для создания документа HTML используется текстовый редактор «Блокнот»?
Что такое парные теги, одиночные теги?
Какие теги отвечают за: создание всего документа HTML, зоны заголовка, информационной зоны?
Что нужно сделать, чтобы документ просматривался с помощью Internet Ехрlоrеr?
Рекомендованная литература [1-4, 8]