Указания по выполнению работы. 1. Используя коллекцию графики из набора вариантов к работе №8, создать графическое изображение (размер не более 500х500 пикселей) для использования в

1. Используя коллекцию графики из набора вариантов к работе №8, создать графическое изображение (размер не более 500х500 пикселей) для использования в качестве статичного изображения заднего плана документа.

2. Создать первую страницу HTMLдокумента, аналогично предыдущей работе.

3. Создать 3 дополнительные страницы с различным цветом фона страницы:

· страница 2;

· страница 3;

· страница 4.

Главному документу присвоить имя INDEX.HTM. Припомощи тэга <A HREF=> Текстовая ссылка </A> организовать связь главного документа с тремя другими документами, обеспечивая перекрашивание гипертекстовой ссылки при наведении на неё курсора.

4. Перенесите текст параграфа 2 на страницу 2 и создайте ссылку со слов «Параграф 2» на первой странице на страницу 2.

5. Повторите п. 4 для параграфов 3 и 4.

6. Снабдите текст комментарием – Это сайт студента …………. из …. страниц.

7. Проверьте через браузер правильность выполнения заданий данной работы.

Сообщите преподавателю об окончании работы.

Контрольные вопросы

1. Каким тэгом определяется ссылка?

3. Для чего служат тэги<А>и < /A>?

4. Как задать графическую ссылку?

5. Как создать ссылку для отправки электронной почты?

6. Как задать текстовый комментарий?

7. Как задать статичное изображение заднего плана документа?

8. Как обеспечить перекрашивание гипертекстовой ссылки при наведении на неё курсора?

9. Рекомендуется ли для графических ссылок уменьшать размер исходного изображения при помощи атрибутовWIDTH иHEIGHT?

10. Существует ли ограничениена длину фразы, являющейся гиперссылкой?

Литература/источники

1. Леонтьев В. Новейшая Энциклопедия ИНТЕРНЕТА 2009 / В. Леонтьев. –М.: ОЛМА Медиа Групп, 2009.

3. Глушаков С.В., Сурядный А.С., Тесленко Н.С. Новейшая Энциклопедия работы в Интернете / С.В. Глушаков. –М.: АСТ, 2008,

4. Жёлтые страницы INTERNET [электронный ресурс], доступ: http://yp.piter.com/

5. Справочник по HTML: http://htmlbook.ru/html

6. Верстка сайтов: http://htmlcssjs.ru/


 

РАБОТА№10

Разработка таблиц в составе HTML документов

 

Цель работы:Изучить основы и получить навыки создания таблиц и структурирования информации HTML документов с их помощью, для размещения в Интернет.

 

В результате выполнения данной работы студенты должны изучить на практике способы подготовкиинформации в табличной форме для размещения ее в Интернет.

В конце лабораторной работы студенты должны представить отчёт по работе преподавателю и ответить на его вопросы.

 

Предварительные указания по порядку выполнения работы.

 

1. Изучите теоретическую вводную часть к данной работе.

2. При необходимости, используйте вводную часть работ №8 и 9..

3. В приложении к сборнику лабораторных работ находитсясправочник по тэгам языка HTML

4. Отчётом по данной работе является страница (файл) HTML, имя которого является фамилией студента с инициалами.

5. При выполнении работы создание и редактирование текста выполняется при помощи редактора Блокнот (Notepad).

6. Просмотрстраниц выполняется из браузера Internet Explorer.

 

Введение.

Таблицы используются для представления информации в виде горизонтальных рядов и вертикальных колонок или для форматирования текста и графики. Каждая клетка таблицы называется ячейкой.

Ячейки могут содержать в себе текст, графику, или другую таблицу. Текст и графика внутри ячейки могут представлять собой внешние или внутренниессылки.

Начинается каждая новая таблица тэгом <TABLE>, а заканчивается парным ему тегом </TABLE>. Тэг <TABLE>задаёт базовые характеристики таблицы – расстояния между ячейками, ширину таблицы относительно экрана и т. п. Например, следующая пара тэгов:

<TABLE ALIGN=CENTER BORDER=2 WIDTH=50% >

………………………………………………………………

</TABLE>

описывает таблицу, выровненную по центру экрана, занимающую 50 процентов ширины экрана (атрибутWIDTH=) и имеющую рамку размером в 2 пиксела (атрибут BORDER=). Если атрибут BORDER не задан или равен 0, рамка не отображается.

Ширину таблицы можно задавать в абсолютных значениях (в пикселах). Если ширина не задана, размер таблицы по ширине определяется программно и зависит от размеров и особенностей форматирования текста (или графики) внутри ячеек.

Высота всей таблицы и, соответственно, отдельных ее ячеек может быть определена атрибутом HEIGHT= тега </TABLE>. Если этот атрибут не задан, высота программно устанавливается в зависимости от размера шрифта и особенностей форматирования текста внутри ячеек.

Каждый ряд таблицы описывается парой тэгов <TR> и </TR>. Колонки внутри каждого ряда описываются тэгами <TD> и </TD> Содержимое каждой ячейки (это может быть текст, графическое изображение новая таблица, ссылка и т.п.) помещается между тэгами <TD> и </TD>.

Тэг <CAPTION> внутри тега <TABLE> описывает заголовок таблицы. При помощи атрибута Align заголовок может быть размещён сверху (значение TOP)или внизу таблицы (значение BOTTOM).

Тэги <TH> и </TH> внутри тега <TABLE> задают названия столбцов.

Примерпростойтаблицы.

<table width=350 height=200 border=2frame=box rules=all align=left bgcolor=#ccccff> <caption align=top><h3>Примерпростойтаблицы</caption></h3> <TR align=centerbgcolor=#ffff00> <TH>Колонка 1 </TH><TH>Колонка 2 </TH><TH>Колонка 3 </TH> </TR> <tr> <td>Ячейка1-1</td><td>Ячейка1-2</td><td>Ячейка1-3</td> </tr> <tr> <td>Ячейка2-1</td><td>Ячейка2-2</td><td>Ячейка2-3</td> </tr> <tr> <td>Ячейка3-1</td><td>Ячейка3-2</td><td>Ячейка3-3</td> </tr> </table>