документе Теоретические сведения Таблицы представляют собой особую часть HTMLдокумента.

Работа добавлена на сайт samzan.net:

ЛАБОРАТОРНАЯ РОБОТА № 7

Создание таблиц в HTML-документе

Теоретические сведения

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

название таблицы,
заголовки столбцов,
ячейки.

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

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

Тег	Форма записи	Примечание
TABLE	<TABLE>текст</TABLE>	Объявление таблиц.
TR	<TR>текст</TR>	Объявление строки.
TD	<TD>текст</TD>	Объявление ячейки в строке.

Атрибуты тега <TABLE>

Атрибут	Форма записи	Примечание
BORDER	<TABLE BORDER=X>	Задает рамку вокруг таблицы.
WIDTH	<TABLE WIDTH=XX%>	Задает ширину таблицы как ХХ% от ширины страницы или как ХХ пикселов.
BGCOLOR	<TABLE BGCOLOR="#RRGGBB">	Задает цвет фона таблицы.

Атрибуты тегов <TD> и <TR>

Атрибут	Форма записи	Примечание
ALIGN	<TD ALIGN=X>	Устанавливает выравнивание по горизонтали (Right, Left, Center)
VALIGN	<TD VALIGN=X>	Устанавливает выравнивание по вертикали (Top, Middle, Bottom, Baseline)
BGCOLOR	<TD BGCOLOR= "#RRGGBB">	Задает цвет фона ячейки.

Еще один тег для оформления ячеек таблиц — тег <TH>...</TH> — нужен для задания заголовочных ячеек. Он во всем совпадает с тегом <TD>, но в отличие от него, содержимое выдается жирным шрифтом и центрируется.

Если нужно задать заголовок всей таблицы, используйте тег <CAPTION параметры>...</CAPTION>. Он должен быть внутри тега <TABLE>, но вне описания ячеек. Тег имеет один параметр:
ALIGN - указывает положение заголовка: он может быть в верхней (TOP) или нижней (BOTTOM) части таблицы.

2. Ход работы

Создание простой таблицы.

Запустите стандартную программу Блокнот (Notepad) и наберите следующий текст с элементами форматирования:

<html>

<body>

</table>

</body>

</html>

Для просмотра созданной Web-страницы используйте броузер Microsoft Internet Explorer.
Вставьте в тег <table> следующие атрибуты: width=50% align="center" bgcolor="yellow" bordercolor="blue". Просмотрите обновленный документ в браузере.
Добавьте в тег <table> атрибут: cellspacing=5. Просмотрите обновленный документ в браузере.
Измените значение атрибута cellspacing на 10, 30 и посмотрите что произойдет с таблицей.
Добавьте между второй парой тегов <tr>:</tr> теги <td>год</td> <td>Ф.И.О.</td> Просмотрите полученный документ в окне браузера.
Добавьте между третьей парой тегов <tr>:</tr> теги <td>№_зачетки</td> <td>группа</td> Просмотрите обновленный документ в браузере.
Добавьте в первой паре тегов <tr>:</tr> в теге <td> атрибут colspan=3. Просмотрите полученный документ в окне браузера.
Добавьте в первой паре тегов <tr>:</tr> в теге <td> еще атрибут align="center" Просмотрите полученный документ в окне браузера.
Добавьте во второй паре тегов <tr>:</tr> в первом теге <td> атрибут rowspan=2. Просмотрите полученный документ в окне браузера.
Удалите из второй пары тегов <tr>:</tr> тег <td>группа</td> Просмотрите полученный документ в окне браузера.

3. Задание на самостоятельное выполнение

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

<HTML>

<HEAD>

</HEAD>

<TITLE> Расписание занятий I курса</TITLE>

</HEAD>

</P>

<FONT COLOR="BLUE" SIZE="4" FACE="COURIER"><B> Понедельник </B></FONT><BR>

</TR>

<TR>

<TD>1</TD> <TD>Мировые инф. рес-сы</TD> <TD>Проектирование Интернет-приложений</TD> <TD>Тхн. проект-ия СП</TD>

</TR>

<TR>

<TD>2</TD> <TD>Проектирование Интернет-приложений</TD> <TD>Мировые инф. рес-сы</TD> <TD>Проектирование Интернет-приложений</TD>

</TR>

<TR>

<TD>3</TD> <TD>Тхн. проект-ия СП</TD> <TD>Тхн. проект-ия СП</TD> <TD>Мировые инф. рес-сы</TD>

</TR>

</TABLE>

</BODY>

</HTML>

Сохраните файл под именем schedule_monday.html.
Используя различные варианты оформления таблиц, создайте файлы с именами schedule_tuesday.html и schedule_wednesday.html, содержащие расписание на вторник и среду, соответственно.
В файле schedule_friday.html создайте таблицу такого вида:

Для созданной таблицы установите следующие параметры: расположение на экране – центральное, ширина 550 пикселей. Цвет вертикальной общей ячейки – голубой. Цвет всей таблицы – зеленый. Расположение текста в ячейках – по центру.
В файле schedule_sunday.html создайте таблицу такого вида:

Для созданной таблицы установите следующие параметры: расположение на экране – левостороннее, ширина 550 пикселей. Цвет общей горизонтальной ячейки – красный. Цвет всей таблицы – желтый.
В файле schedule_thursday.html создайте таблицу такого вида:

Для созданной таблицы установите следующие параметры: расположение на экране – правостороннее, ширина 550 пикселей. Цвет общей ячейки – оранжевый. Цвет всей таблицы – серый.

4. Содержание отчета

1. Выполнить все описанные операции с текстом, содержащим личную информацию (Ф.И.О., номер зачетной книжки и т.д.)

2. Представить HTML-коды выполненных операций.

3. Представить скрины готовых HTML-документов.

4. При сдаче работы иметь исходные файлы.

5. Задания и вопросы для аттестации

1. Уметь показать способ создания HTML-таблиц.

2. Знать принципы формирования HTML- таблиц.

3. Знать основные теги.

Ф.И.О.

Ф.И.О., группа

№_зачетки

1. ТЕМАТИКА контрольных работ по дисциплине ЧАСТНЫЕ МЕТОДИКИ афк для студентов 4 курса заочного отделени
2. Интегрированная логистическая поддержка ИЛП промышленной продукции Экономические предпосылки
3. Хроническим кашлем считают если ежедневная симптоматика у ребенка отмечается в течение- 2 недель
4. Курский государственный университет Кафедра социальнокультурного сервиса и туризма
5. Бал Одним днем ввечеру из села очутился я в городе {Полтаве
6. Работа с некоторыми Win PI функциями (информация о системе)
7. ru Все книги автора Эта же книга в других форматах Приятного чтения Кен Кизи Над кукушкиным г
8. Исследование работы колесно-шагающего движителя и двигателя для передвижения по лестничным маршам
9. Тема Системный подход к управлению Понятие системы классификация их свойства Организация как с
10. реферат дисертації на здобуття наукового ступеня кандидата економічних наук3
11. Государственная собственность и государственное предпринимательство в системе современного хозяйствования
12. тематически сгруппированных философских текстов извлечений из трудов мыслителей разных эпох включая совр2
13. На тему- Нова українська література і театр
14. Уренгойская Детская художественная школа Конспект занятия по р
15. Сущность философии и концепции управления персоналом Философия управления персоналом философскопонят
16. Развитие Украинского питания
17. Возмещение вреда причиненного юридическому лицу в результате распространения сведений порочащих е
18. Статистика рисковых активов коммерческого банка
19. Трайдент Хіт є власною мережею туроператора Трайдент.
20. РЕФЕРАТ дисертації на здобуття наукового ступеня кандидата юридичних наук Харків ~1

Материалы собраны группой SamZan и находятся в свободном доступе