Сайты созданные с помощью гипертекста HTML
Практическая работа «Разработка сайта с использованием языка разметки гипертекстовых документов HTML»
Цель работы: формирование навыков использования основных тэгов языка HTML при создании Web-сайта в текстовом редакторе Блокнот.
Описание сайта
Web-сайт состоит из 5 связанных гиперссылками страниц:
- Титульная страница «Времена года» — файл index.htm;
- «Зима» – файл winter.htm;
- «Весна» – файл spring.htm;
- «Лето» – файл summer.htm;
- «Осень» – файл autumn.htm.
Описание работы
Часть 1 Создание страницы «Зима»
Скопировать папку «Времена года» в личную папку.
- Запустить приложение Блокнот. Создать html-код страницы «Зима», опираясь на изученный ранее материал (конспект, текст параграфа).
- Разместить на странице теги, определяющие страницу в целом.
- Введите заголовок первого уровня «Времена года» и заголовок второго уровня «Зима». Отцентрируйте заголовки.
- Выполните отбивку заголовков прямыми линиями. Цвет первого заголовка – черный, цвет второго – синий.
- Сохранить файл в папке «Времена года»: установите тип файлов – «Все файлы», укажите имя файла – winter.htm.
- Просмотрите страницу в браузере.
- Установите фоновый цвет страницы (голубой, bgcolor=»ccccff»).
- Поместите рисунок, выравнивая его по правому краю документа.
- Поместите стихотворение, выравнивая его по левому краю страницы. Каждую строку оформите отдельным абзацем, строфы отделите пустой строкой.
- Создайте панель навигации по сайту.
- Сохраните файл. Просмотрите страницу в браузере. Она должна иметь вид, соответствующий образцу.
Часть 2 Создание страницы «Весна»
- Запустить приложение Блокнот. Создать html-код страницы «Весна».
- Заголовки и их отбивку выполнить аналогично странице «Зима», цвет второго заголовка – зеленый.
- Цвет фона – бирюзовый (bgcolor=»00ffcc»).
- Стихи разместить аналогично странице «Зима», начертание символов определить как полужирный курсив.
- Рисунок разместить аналогично странице «Зима», установив размеры изображения по вертикали и горизонтали: 450 на 600 пикселей.
- Сохранить файл в папке «Времена года». Указать тип файлов – «Все файлы». Указать имя файла – spring.htm
- Открыть файл spring.htm с помощью браузера Internet Explorer. Вид окна должен соответствовать образцу.
Часть 3 Создание страницы «Лето»
- Запустить приложение Блокнот. Создать html-код страницы «Лето».
- Заголовки и их отбивку выполнить аналогично, цвет заголовков – черный.
- Разместить объекты на странице, согласно образцу. Цвет фона – зеленый (bgcolor=»00cc66″).
- Сохранить файл в папке «Времена года». Указать тип файлов – «Все файлы». Указать имя файла – summer.htm.
- Открыть файл summer.htm с помощью браузера Internet Explorer. Вид окна должен соответствовать образцу.
Часть 4 Создание страницы «Осень»
Запустить приложение Блокнот. Создать html-код страницы «Осень».
- Заголовки и их отбивку выполнить аналогично, цвет первого заголовка – черный, второго – коричневый оттенок #993300.
- Разместить объекты на странице, согласно образцу. Цвет фона – желтый (bgcolor=»ffcc66″).
- Сохранить файл в папке «Времена года». Указать тип файлов – «Все файлы». Указать имя файла – autumn.htm.
- Открыть файл autumn.htm с помощью браузера Internet Explorer. Вид окна должен соответствовать образцу.
Часть 5Создание титульной страницы
Запустить приложение Блокнот. Создать html-код титульной страницы.
- Поместить заголовок первого уровня «Времена года», выравнивание – по центру, цвет заголовка – синий.
- Выполнить отбивку заголовка прямой линией.
- Поместить таблицу из 2 строк и двух столбцов. Задать ширину границ – 3 пункта, размер ячеек 300 на 200 пикселей.
- Поместить в ячейки иллюстрации.
- Добавить панель навигации.
- Сохранить файл в папке «Времена года». Указать тип файлов – «Все файлы». Указать имя файла – index.htm.
- Открыть файл index.htm с помощью браузера Internet Explorer. Вид окна должен соответствовать образцу.
nsportal.ru
Создание Web-сайта на языке HTML. Учебное пособие
В примерной программе по информатике и ИКТ на тему “Коммуникационные технологии” отводится всего 12 часов и предлагается создать Web-страничку с использованием шаблонов. На тему “Мультимедийные технологии” выделяется 8 часов, но если в образовательном учреждении информатика изучается на пропедевтическом уровне уже в 5, 6 и 7 классах, то целесообразно перенести изучение мультимедийных технологий в пропедевтический курс и тогда можно увеличить время на изучение коммуникационных технологий, а точнее, можно добавить тему “Создание Web-сайтов на языке HTML” в 8 классе.
Освоение технологии создания сайтов рекомендуется начать с языка разметки гипертекста HTML в программе Блокнот, что является первоосновой в данном направлении. Конечно, за 8 часов невозможно изучить весь язык HTML, но можно показать назначение и применение основных тегов языка. Если ученик заинтересуется технологией создания сайтов, то сможет продолжить изучение материала самостоятельно или на соответствующих курсах, кружках или факультативах.
Представленное методическое пособие прошло неоднократную опрабацию в 8-х классах гимназии №441 Фрунзенского р-на Санкт-Петербурга и включает материал для проведения теоретических и практических занятий, выполнение которых сначала демонстрируется через проектор, а затем учащиеся выполняют самостоятельно на компьютере, используя раздаточный материал к уроку.
Для учащихся, которые бысторо выполнили запланированную работу на уроке предусмотрены дополнительные задания.
Эффективно осваивается материал, когда учащиеся вместе с учителем выполняют общий проект, например, по теме из истории Санк-Петербурга “Драматические театры Санкт-Петербурга”, а затем в качестве итоговой работы создают собственный небольшой проект, используя в качестве шаблона сайт, созданный совместно с учителем.
В качестве зачетной работы ученики отвечают на вопросы теста на знание тегов HTML и представляют созданный самостоятельно сайт.
Основные цели обучения: формирование познавательного интереса, развитие интеллектуальных и творческих способностей в области Web-технологий.
Задачи.
Обучающие:
- сформировать систему знаний по технологии создания Web-сайтов;
- обучить языку разметки гипертекста HTML для создания сайтов;
- познакомить с этапами проектной деятельности.
Развивающие:
- развить творческие способности к самовыражению, посредством создания сайтов;
- сформировать умение сопоставлять, искать аналог и осуществлять перенос знаний в новую предметную область Web-технологий;
- развить навыки работы на компьютере
Воспитательные:
- воспитать добросовестное отношение к работе;
- воспитать чувства товарищества и личной ответственности за созданный сайт;
- воспитать художественный и эстетический вкус;
- воспитать грамотного и корректного пользователя сети Интернет.
Урок 1
1. Общие сведения о Web-сайтах и языке HTML
Публикации во Всемирной паутине (World Wide Web) реализуются в форме Web-сайтов. Web-сайт по своей структуре напоминает журнал, который содержит информацию, посвящённую какой-либо теме или проблеме. Как журнал состоит из печатных страниц, так и Web-сайт состоит из компьютерных Web-страниц, объединённых гиперссылками. Web-страницы могут содержать текст, рисунки, таблицы, мультимедийные и динамические объекты. Создание Web-сайтов можно осуществлять с помощью языка HTML.
HTML – Hyper Text Markup Language — язык разметки гипертекста. HTML ни в коей мере не является языком программирования, он отвечает только за расположение элементов (текста, рисунков) в окне браузера. HTML является языком для создания Web-сайтов во Всемирной паутине. Язык HTML состоит из простых команд – тегов. Теги управляют представлением информации на экране при отображении HTML-документа. Теги заключаются в угловые скобки <>…</> и бывают парные и непарные (одиночные <>).
Документ HTML – это текстовый файл с расширением .html или .htm, содержащий набор тегов.
Браузер – (browser) – программа для просмотра Web-страниц. Широко используют бразеры Microsoft Internet Explorer, Opera и др. Браузер при получении документа HTML выполняет его анализ, строит объектную модель документа, затем результат отображает на мониторе.
2. Структура HTML-документа
<HTML>Секция заголовка Записываются meta-теги, содержащие информацию о названии страницы, об авторе и др. </HEAD> <BODY> Тело документа Содержит непосредственно информацию страницы: тексты, рисунки, таблицы </BODY> </HTML> |
3. Форматирование символов
Символы, заключенные между следующими тегами отображают:
| <B>….</B> — полужирный
шрифт <I>……</I> — курсивный шрифт <U>……</U> — подчеркнутый шрифт |
<SUB>…</SUB> — нижний
индекс <SUP>…</SUP> — верхний индекс |
Параметры шрифта
Текст, заключенный между тегами <FONT….> ……..</FONT> имеет заданный размер, цвет и гарнитуру. Для этого используются атрибуты: SIZE = значение от 1 до 7 и COLOR = цвет (aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, yellow, white), каждому цвету соответствует свой шестнадцатеричный код от 000000 до FFFFFF.
Если в тексте имеется несколько пробелов между словами или символы табуляции, то браузер на экран выводит всего один пробел. Если необходимы дополнительные пробелы то между словами надо добавить
Одиночный тег <BR> разрывает текстовый поток и вставляет пустую строку. Несколько таких тегов добавляют несколько пустых строк. Межстрочный интервал – одинарный.
4. Практическое задание №1.
Создание первого HTML-документа “Драматические театры Санкт-Петербурга”, работа со шрифтами, задание цвета и размера шрифта. Освоение технологии работы.
Урок №2
1. Форматирование текста по абзацам
Тег <P> …</P> — начинает абзац с новой строки. Новый абзац отделяется от предыдущего двойным межстрочным интервалом.
Выравнивание текста по абзацам:
| <P ALIGN=CENTER> …</P> — по
центру <P ALIGN=JUSTIFY>…</P> — по ширине |
<P ALIGN=LEFT>… </P> — по
левому краю <P ALIGN=RIGHT>…</P> — по правому краю |
2. Задание цвета всего текста и фона документа
Описываются в начальном теге тела документа <BODY>
<BODY BGCOLOR=цвет фона документа TEXT=цвет текста >.
3. Заголовки разных уровней
Тегами <Hn>….</Hn> оформляют заключенный в них текст. Значения n меняются от 1 до 6, при этом текст выводится от более крупного к более мелкому. Теги <Hn>….</Hn> могут иметь атрибуты ALIGN=CENTER, LEFT, RIGHT.
4. Простые списки
| <UL>……</UL> -
неупорядоченный (ненумерованный) список <OL>……</OL> — упорядоченный (нумерованный) список Часть текста, которая будет оформляться как список, заключается в соответствующие теги, а каждый элемент списка помечается одиночным тегом <LI> |
Виды нумераций списков: <OL TYPE=»Square»> <OL TYPE=»Circle»> <OL TYPE=»Disk»> <OL TYPE=»A»> <OL TYPE=»I»> |
5. Практичекое задание №2
Форматирование текста по абзацам, цвет фона, заголовки разных уровней, списки.
Урок №3
1. Вставка графических изображенийВсеми браузерами поддерживаются форматы .gif, .jpg. Эти форматы являются растровыми. GIF – поддерживается прозрачность и анимацияю, хорошо подходит для рисованных изображений. JPG – для полноцветных изображений, хорошо подходит для отсканированных изображений и фотографий, анимацию не поддерживает.
Одиночный тег <IMG> вставляет графические изображения в текстовый поток в любом месте:
<IMG SRC=’имя графического файла’>
Необязательные атрибуты тега <img>:
| ALT = альтернативный
текст BORDER = толщина обрамляющей рамки в пикс., 0 нет рамки HEIGHT = высота изображения в пикселах или % WIDTH = ширина изображения в пикселах или % |
HSPACE = свободное
пространство слева и справа от изображения в
пикселах или % VSPACE =- свободное пространство сверху и снизу от изображения в пикселах или % ALIGN = left, right, middle выравнивание изображения |
Чтобы рисунок был по центру, можно использовать тег <CENTER>…….<CENTER>/
2. Практическое задание №3
Вставка и форматирование графических изображений. Самостятельное создание Web-страниц драматических театров.
Урок №4
1. Гиперссылки
Связь с другими документами организуется тегами <A>…</A>.
<A HREF=”имя файла на который надо перейти” > текст гиперссылки </A>.
Рисунок так же можно сделать, как гиперссылку, написав:
<A HREF =’имя файла на который переходим’>< IMG SRC =’имя графического файла’></a>
2. Практическое задание №4
Оформление списка театров на главной странице glavn.htm, как гиперссылки на соотвествующие Web-страницы театров.
Урок №5
1. Таблицы
Используют не только для того, чтобы располагать данные в ячейках, сколько с целью позицирования фрагментов текста и изображений друг относительно друга.
С помощью таблиц удобно создавать навигацию по сайту.
| <TABLE>…</TABLE> — вся
таблица. <TR>…</TR> — строка. <TD>…</TD> — ячейка в ряду. |
Пример таблицы из двух строк (рядов), содержащих по две ячейки:
Текст ячейки 1, 1 |
Текст ячейки 1 2 |
Текст ячейки 2, 1 |
Текст ячейки 2, 2 |
| <TABLE> таблица <TR> <TD> текст ячейки 1,1</TD> <TD> текст ячейки 1,2</TD> </TR> первая строка <TR> <TD> текст 2,1 ячейки </TD> <TD> текст 2,2 ячейки </TD> </TR> вторая строка </TABLE> |
Ячейки таблицы могут содержать текст или изображения, а также текст с HTML-тегами и гиперссылки. Не следует оставлять ячейки таблицы незаполненными, надо поместить хотя бы неразрывный пробел
Основные атрибуты тегов <TABLE> <TR> и <TD> задают параметры таблицы, строки или ячейки:
ALIGN=left, right, center – выравнивание (<table>, <tr>, <td>)
BGCOLOR=’цвет’ – фоновый цвет (<table>, <tr>, <td>)
HSPACE=значение – свободное пространство слева и справа от таблицы в пикселах (<table>)
VSPACE=значение — свободное пространство сверху и снизу от таблицы в пикселах (<table>)
WIDTH=значение – ширина таблицы (ячейки) – в пикселах, или в процентах (<table>, <td>)
HEIGHT= значение – высоты таблицы (ячейки, строки) – в пикселах, или в процентах (<table>, <td>, <tr>)
BORDER= значение – толщина рамки вокруг таблицы и ее ячеек, по умолчанию значение=1, если значение=0, то рамки нет (<table>, <td>)
BORDECOLOR=’цвет’ – цет рамки (<table,<td>>)
VALIGH=bottom, middle, top – выравнивание содержимого по вертикали (<tr>, <td>)
2. Практичекое задание №5
Создание навигации по сайту в форме таблицы из одной строки
Уроки №6 и №7
1. Секция заголовка <HEAD>, мета-теги
В секции заголовка на каждой странице указывается информация о документе, которая используется при его отображении. Текст, заключенный между тегами <TITLE> … </TITLE>, отображается в заголовке окна браузера.
В секции заголовка обычно помещается и ряд тегов <META> с различными атрибутами, предоставляющими дополнительную информацию (метаинформацию) о Web-сайте:
<HEAD>
<title>Драматические театры Санкт-Петербурга</title>
<meta HTTP-EQUIV=»Content-Type» CONTENT=»text/html; charset=windows-1251″> — — (указывается тип кодовой таблицы (windows-1251, Koi8-R и другие), использованной при подготовке текстовой части документа.
<meta name=»author» CONTENT=»Смирнова Татьяна, учитель 441 гимназии СПб»> — информация об
<meta name=»Keywords» content=»драматические, театры, Товстоногов, Комиссаржевская, Европа, ул.Рубинштейна”> (указывается через запятую набор ключевых слов, которые могут быть использованы рядом поисковых систем)
</HEAD>
2. Самостоятельная работа над своим проектом
Примерные темы проекта: “Мосты через Неву”, “Реки и каналы Санкт-Петербурга”, “Мосты через каналы Санкт-Петербурга”, “Необычные музеи Санкт-Петербурга”, “Музыкальные театры”, “Филармонии и капелла”, “Технические ВУЗ-ы Санкт-Петербурга”, “Детские театры Санкт-Петербурга”, “Гуманитарные ВУЗ-ы Санкт-Петербурга”, “Пригороды Санкт-Петербурга”, “Музеи Санкт-Петербурга”, “Военные учебные заведения в Санкт-Петербурге” и др.
Необходимо оформить главную страницу сайта по образцу файла glavn.htm, выбрав в качестве навигации по сайту таблицу или список, и 2 — 3 страницы, раскрывающие содержание сайта и содержащие: заголовок, текст и рисунок.
Урок №8
1. Контрольный тест на знание тегов HTML – 15 минут.
2. Рефлексия. Представление проекта и оценивание его учениками класса и учителем – 30 минут.
Практические задания – Приложение 1.
Вопросы контрольного теста – Приложение 2.
Литература для учителя
- Усенков Д.“Уроки Web-мастера”, Москва, БИНОМ, 2004 г.
- Смирнова И. “Начала Web-дизайна, Санкт-Петербург, БХВ, 2004г.
- Томас А.Пауэл “Web-дизайн. Наиболее полное руководство. В подлинике”, 2-е издание, БХВ-СПБ, 2005 г.
- Браун М. “HTML 3.2. Наиболее полное руководство. В подлиннике”, БХВ-СПб, 1999
- Захаркина В.В. “Основы создания Web-страниц”, методическое пособие, СПБ, 2000 г.
- К.Ахметов, “Microsoft Internet Explorer 4.0 для всех”, изд-во Компьютер, Москва, 1997 г.
Литература для ученика
- Усенков Д.“Уроки Web-мастера”, Москва, БИНОМ, 2004 г.
- Смирнова И. “Начала Web-дизайна, Санкт-Петербург, БХВ, 2004г.
Перечень Internet-ресурсов
- http://htmlbook.ru — Мержевич Влад. Краткий, но информационно насыщенный учебник по технологии создания сайтов, HTML, CSS, дизайну, графике и др.
- http://html.manual.ru — Городулин
urok.1sept.ru
Разработка сайта с использованием языка разметки гипертекстовых документов НТМl. Практическая работа для учащихся 8-го класса
Цель работы: формирование навыков использования основных тэгов языка HTML при создании Web-сайта в текстовом редакторе Блокнот.
Программное обеспечение: стандартное приложение Windows Блокнот.
Предварительная подготовка:
- Создать на рабочем диске папку “Времена года” с подготовленными иллюстрациями. Приложение 1.
- Подготовить тексты заданий (если необходимо – с HTML-кодами страниц). Приложение 2.
- Подготовить текст стихов, размещаемых на страницах. Приложение 3.
Предварительная подготовка учащихся: учащиеся должны быть знакомы с форматом основных тэгов HTML.
Описание сайта
Web-сайт состоит из 5 связанных гиперссылками страниц:
- Титульная страница “Времена года” – файл index.htm;
- “Зима” – файл winter.htm;
- “Весна” – файл spring.htm;
- “Лето” – файл summer.htm;
- “Осень” – файл autumn.htm.
Описание работы
Часть 1
Создание страницы “Зима”
- Скопировать папку “Времена года” в личную папку.
- Запустить приложение Блокнот. Создать html-код страницы “Зима”, опираясь на изученный ранее материал (конспект, текст параграфа).
- Разместить на странице теги, определяющие страницу в целом.
- Введите заголовок первого уровня “Времена года” и заголовок второго уровня “Зима”. Отцентрируйте заголовки.
- Выполните отбивку заголовков прямыми линиями. Цвет первого заголовка – черный, цвет второго – синий.
- Сохранить файл в папке “Времена года”:
- установите тип файлов – “Все файлы”, укажите имя файла – winter.htm.
- Просмотрите страницу в браузере.
- Установите фоновый цвет страницы (голубой, bgcolor=»ccccff»).
- Поместите рисунок, выравнивая его по правому краю документа.
- Поместите стихотворение, выравнивая его по левому краю страницы. Каждую строку оформите отдельным абзацем, строфы отделите пустой строкой.
- Создайте панель навигации по сайту.
- Сохраните файл. Просмотрите страницу в браузере. Она должна иметь вид, соответствующий образцу.
Код страницы:
<HTML>
<HEAD>
<TITLE> Времена года </TITLE>
</HEAD>
<body bgcolor=»ccccff»>
<h2 ALIGN=»center»> Времена года </h2>
<HR>
<FONT COLOR=»blue»>
<h3 ALIGN=»center»> Зима </h3>
</FONT>
<HR>
<IMG SRC=»zima.jpg» ALT=»Зима» ALIGN=»right»>
<P ALIGN=»left»> Чудная картина, </P>
<P> Как ты мне родна: </P>
<P> Белая равнина, </P>
<P> Полная луна, </P>
<BR>
<P> Свет небес высоких, </P>
<P> И блестящий снег, </P>
<P> И саней далеких </P>
<P> Одинокий бег. </P>
<BR>
<P ALIGN=»center»>
[<A HREF=»winter.htm»> Зима</A>]  
[<A HREF=»spring.htm»> Весна </A>]  
[<A HREF=»summer.htm»> Лето </A>]  
[<A HREF=»autumn.htm»> Осень </A>]  
</P>
</body>
</HTML>
Часть 2
Создание страницы “Весна”
- Запустить приложение Блокнот. Создать html-код страницы “Весна”.
- Заголовки и их отбивку выполнить аналогично странице “Зима”, цвет второго заголовка – зеленый.
- Цвет фона – бирюзовый (bgcolor=»00ffcc»).
- Стихи разместить аналогично странице “Зима”, начертание символов определить как полужирный курсив.
- Рисунок разместить аналогично странице “Зима”, установив размеры изображения по вертикали и горизонтали: 450 на 600 пикселей.
- Сохранить файл в папке “Времена года”. Указать тип файлов – “Все файлы”. Указать имя файла – spring.htm
- Открыть файл spring.htm с помощью браузера Internet Explorer. Вид окна должен соответствовать образцу.
Код страницы:
<HTML>
<HEAD>
<TITLE> Времена года </TITLE>
</HEAD>
<body bgcolor=»00ffcc»>
<h2 ALIGN=»center»> Времена года </h2>
<HR>
<FONT COLOR=»green»>
<h3 ALIGN=»center»> Весна </h3>
</FONT>
<HR>
<IMG SRC=»vesna.jpg» haight=»450″ ALT=»Весна» ALIGN=»right»>
<P ALIGN=»left»>
<P><B><I>Зеленым бисером на ветках </P></B></I>
<P><B><I>Явились первые листочки</P></B></I>
<P><B><I>И в небе облаков виньетки,</P></B></I>
<P><B><I>И певчих птиц большие точки.</P></B></I>
<BR>
<P><B><I>И заиграло ярким светом</P></B></I>
<P><B><I>Весной разбуженное небо…</P></B></I>
<P><B><I>И закружилась над планетой</P></B></I>
<P><B><I>Весна, но канет вскоре в небыль</P></B></I>
<BR>
<P ALIGN=»center»>
[<A HREF=»winter.htm»> Зима</A>]  
[<A HREF=»spring.htm»> Весна </A>]  
[<A HREF=»summer.htm»> Лето </A>]  
[<A HREF=»autumn.htm»> Осень </A>]  
</P>
</body>
</HTML>
Часть 3
Создание страницы “Лето”
Код страницы:
<HTML>
<HEAD>
<TITLE> Времена года </TITLE>
</HEAD>
<body bgcolor=»00cc66″>
<h2 ALIGN=»center»> Времена года </h2>
<HR>
<FONT COLOR=»black»>
<h3 ALIGN=»center»> Лето </h3>
</FONT>
<HR>
<IMG SRC=»leto.jpg» haight=»450″ ALT=»Лето» ALIGN=»right»>
<P ALIGN=»left»>
<P>Лениво дышит полдень мглистый, </P>
<P>Лениво катится река, </P>
<P>И в тверди пламенной и чистой </P>
<P>Лениво тают облака.</P>
<BR>
<P>И всю природу, как туман, </P>
<P>Дремота жаркая объемлет, </P>
<P>И сам теперь великий Пан </P>
<P>В пещере нимф покойно дремлет.</P>
<BR>
<P ALIGN=»center»>
[<A HREF=»winter.htm»> Зима</A>]  
[<A HREF=»spring.htm»> Весна </A>]  
[<A HREF=»summer.htm»> Лето </A>]  
[<A HREF=»autumn.htm»> Осень </A>]  
</P>
</body>
</HTML>
Часть 4
Создание страницы “Осень”
Код страницы:
<HTML>
<HEAD>
<TITLE> Времена года </TITLE>
</HEAD>
<body bgcolor=»ffcc66″>
<h2 ALIGN=»center»> Времена года </h2>
<HR>
<FONT COLOR=»993300″>
<h3 ALIGN=»center»> Осень </h3>
</FONT>
<HR>
<IMG SRC=»osen.jpg» ALT=»Осень» ALIGN=»right»>
<P ALIGN=»left»>
<P> Унылая пора! Очей очарованье! </P>
<P>Приятна мне твоя прощальная краса – </P>
<P>Люблю я пышное природы увяданье, </P>
<P>В багрец и золото одетые леса, </P>
<P>В их сенях ветра шум и свежее дыханье, </P>
<P>И мглой волнистою покрыты небеса,</P>
<P>И редкий солнца луч, и первые морозы, </P>
<P>И отдалённые седой зимы угрозы.</P>
<BR>
<P ALIGN=»center»>
[<A HREF=»winter.htm»> Зима</A>]  
[<A HREF=»spring.htm»> Весна </A>]  
[<A HREF=»summer.htm»> Лето </A>]  
[<A HREF=»autumn.htm»> Осень </A>]  
</P>
</body>
</HTML>
Часть 5
Создание титульной страницы
Код страницы:
<HTML>
<HEAD>
<TITLE> Времена года </TITLE>
</HEAD>
<body>
<FONT COLOR=»blue»>
<h2 ALIGN=»center»> Времена года </h2>
</FONT>
<HR>
<table align=»center»>
<tr>
<td Haight=»200″ border=»3″ >
<IMG SRC=»zima.jpg» Haight=»200″
ALT=»Зима» ALIGN=»center»> </td>
<td Haight=»200″ border=»3″ >
<IMG SRC=»vesna.jpg» Haight=»200″
ALT=»Весна» ALIGN=»center»> </td>
</tr>
<tr>
<td Haight=»200″ border=»3″ >
<IMG SRC=»leto.jpg» Haight=»200″
ALT=»Лето» ALIGN=»center»> </td>
<td Haight=»200″ border=»3″ >
<IMG SRC=»osen.jpg» Haight=»200″
ALT=»Осень» ALIGN=»center»> </td>
</tr>
</table>
<P ALIGN=»center»>
[<A HREF=»winter.htm»> Зима</A>]  
[<A HREF=»spring.htm»> Весна </A>]  
[<A HREF=»summer.htm»> Лето </A>]  
[<A HREF=»autumn.htm»> Осень </A>]  
</P>
</body>
</HTML>
Приложение 1
Приложение 2
Приложение 3
urok.1sept.ru