Лабораторная работа № 9. Создание и форматирование таблиц

 

Цель работы: Научиться использовать таблицы для оформления WEB-страниц

Задание: для изучения темы, произвести действия в соответствии с методическими указаниями

 

Порядок работы:

1. Создать таблицу по приведенному образцу, сохранить документ под именем tabl_name.htm. Сверху над таблицей разместить заголовок Таблица №1

При отображении таблицы в браузере должны удовлетворяться следующие условия:

- таблица должна быть выравнена по центру и быть правильной (симметричной) формы;

- в центральной ячейке поместить символ * (звездочка), остальные ячейки должны быть пустыми.

Примечание. Для отображения пустых ячеек в них нужно поместить символьный примитив пробела  

1. В этом же документе создать копию таблицы №1, ввести заголовок Таблица №2 и модифицировать ее:

- В центральной ячейке разместить рисунок Arrows3.wmf

- «Раскрасить» все остальные ячейки в различные цвета.

1. Создать еще одну копию таблицы – Таблица №3 и отредактировать теги таблицы так, чтобы она соответствовала приведенному ниже образцу.

Примечание. Для объединения ячеек в тегах <TD> необходимо использовать параметры colspan= и rowspan=

1. Создать новый HTML-документ - rasp_name.htm с расписанием занятий.

- Документ должен начинаться заголовком
Расписание занятий гр. NNN на весенний семестр 2005 г.

- Первая строка таблицы должна быть оформлена как заголовки полей (с использованием тегов <TH>).

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

День недели	Время	Предмет	Преподаватель	Аудитория
Понедельник	8:30-10:05	Математика (лек)	доц. Иванов А.А.	320
	10:15-11:50	Математика (пр)	преп. Петрова И.А.	302
	12:30-14:05	Физика (лаб)	доц. Сидоров О.И.	307
Вторник	8:30-10:05	История (лек)	проф. Громова О.А.	310
	10:15-11:50	История (сем)	преп. Попов М.А.	302
	12:30-14:05	Физика (лаб)	доц. Сидоров О.И.	307
...	...	...	...	...

- Просмотреть созданный документ в броузере при различных размерах окна и различных настройках размера шрифта.

1. Сохранить файл с расписанием под именем rasp_menu_name.htm и модифицировать его.
2. После заголовка создать таблицу, состоящую их одной строки меню с названиями дней недели.

1. В таблице с расписанием установить закладки на названия дней недели.
2. В таблице меню создать гиперссылки на соответствующие дни недели.
3. Выполнить цветовое оформление каждой ячейки меню.
4. Проверить правильность выполнения переходов по гиперссылкам.
5. Создать группу web-страниц, объединенных меню:

- На рабочем диске создать папку My_raspisanie для размещения файлов расписания.

- Поместить расписание на каждый день недели и таблицу с меню в отдельные файлы. Имена файлов: menu.htm – для главной страницы, названия дней недели – для остальных. Все документы разместить в папке My_raspisanie.

- Отредактировать гиперссылки меню так, чтобы по ним выполнялись переходы на соответствующий документ.

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

- Оформить фон каждого дня недели собственным цветом, совпадающим с цветом ячейки таблицы меню.

Теги оформления таблиц

Определить таблицу	<TABLE></TABLE>	Пример <TABLE border=”1” align =«CENTER» > <TR> <TH >Товар</TH> <TH>Цена</TH> </TR> <TR> <TD>Радиотелефон</TD> <TD>2000 </TD> </TR> </TABLE> Товар Цена Радиотелефон 2000
Окантовка таблицы	<TABLE BORDER =”?” </TABLE>
Строка таблицы	<TR> </TR>
Выравнивание	<TR ALIGN=left | right | center | middle | bottom >
Ячейка таблицы	<TD></TD>
Выравнивание по горизонтали	<TD ALIGN=LEFT | RIGHT | CENTER>
Выравнивание по вертикали	<TD VALIGN = TOP|MIDDLE| BOTTOM>
Установка ширины ячейки (в пикселях или %)	<TD WIDTH=«?»>
Заливка цветом ячейки	<TD BGCOLOR = «# цвет»> </TD>	<TD BGCOLOR = «#FF0000»> </TD> красный цвет
Заголовок столбца или строки	<TH>текст </TH>	Текст в ячейке выравнивается по центру, устанавливается жирный шрифт