М ИНИСТЕРСТВО ОБРАЗОВАНИЯ И НАУКИ УКРАИНЫ

Севастопольский национальный технический университет

Методические указания

к выполнению лабораторной работы

” Разработка HTML документов

с использованием таблиц ”

по учебной дисциплине

«Компьютерные сети и телекоммуникации»

для студентов направления подготовки

«Менеджмент»

Севастополь

2008

УДК 658.

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

Методические указания по выполнению лабораторной работы по дисциплине "Компьютерные сети и телекоммуникации" / Сост. Ю.Л. Явкун, Е.В. Козлова - Севастополь: Изд-во СевНТУ, 2008. - 16 с.

Целью методических указаний является применение теоретических знаний по теме "Создание HTML документов с использованием таблиц" в рамках курса «Компьютерные сети и телекоммуникации». Методические указания предназначены для студентов дневной формы обучения по направлению подготовки «Менеджмент».

Содержание

СОДЕРЖАНИЕ 3

1 Цель работы 4

2 Основные теоретические сведения 4

2.1 Определение структуры таблицы 4

2.2 Заголовки в таблицах 5

2.3 Таблицы с заголовком 6

2.4 Объединение ячеек таблицы 7

2.5 Многослойные заголовки 8

2.6 Таблицы с подписью 9

2.7 Выравнивание текста в ячейках таблицы 10

2.8 Таблицы внутри таблиц 11

3. Порядок выполнения работы 12

ПРИЛОЖЕНИЕ А – Параметры оператора <TABLE> 13

ПРИЛОЖЕНИЕ Б - Параметры оператора <TR> 15

ПРИЛОЖЕНИЕ В - Параметры оператора <TD> 16

1 Цель работы

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

2 Основные теоретические сведения

Очень часто приходится размещать в документе HTML табличные данные. Это можно сделать двумя способами.

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

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

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

Для ячейки таблицы можно указать цветовой фон и отступ, что позволяет изображать текст на цветном фоне с отбивкой. Этот прием часто используется в Internet, так как значительно улучшает внешний вид страницы.

2.1 Определение структуры таблицы

В тексте документа HTML таблица определяется между командами <TABLE> и </TABLE>. В простейшем случае строки таблицы ограничиваются командами <TR> и </TR>, а столбцы - командами <TD…> и </TD>, например:

Фрагмент кода	Вид в обозревателе
<TABLE> <TR> <TD>000</TD> <TD>001</TD> <TD>002</TD> </TR> <TR> <TD>010</TD> <TD>011</TD> <TD>012</TD> </TR> <TR> <TD>100</TD> <TD>101</TD> <TD>102</TD> </TR> </TABLE>

На этом и следующих рисунках для экономии места не показан внешний вид окна навигатора Microsoft Internet Explorer, из него вырезано только изображение таблицы.

Первая строка, ограниченная операторами <TR> и </TR>, состоит из трех ячеек, в которых находятся строки “000”, “001” и “002”. Каждая такая строка ограничена операторами <TD> и </TD>.

Команды, которые мы использовали в этом примере, допускают использование параметров, которые мы рассмотрим позже. Эти параметры влияют на внешний вид таблицы.

В следующем листинге приводится фрагмент исходного текста документа HTML, в котором определены две таблицы. Первая из них состоит из трех строк и не имеет никакого дополнительного оформления. Вторая таблица отцентрирована, имеет рамку шириной 2 пиксела и ширину, составляющую 60 процентов от ширины окна просмотра навигатора.

Фрагмент кода	Вид в обозревателе
<TABLE> <TR> <TD>000</TD><TD>001</TD><TD>002</TD> </TR> <TR> <TD>010</TD><TD>011</TD><TD>012</TD> </TR> <TR> <TD>100</TD><TD>101</TD><TD>102</TD> </TR> </TABLE> <TABLE ALIGN=JUSTIFY BORDER=2 WIDTH=60%> <TR><TD>000</TD><TD>001</TD><TD>002</TD></TR> <TR><TD>010</TD><TD>011</TD><TD>012</TD></TR> <TR><TD>100</TD><TD>101</TD><TD>102</TD></TR> </TABLE>

Обычно первая строка таблицы используется для размещения заголовков столбцов. С помощью оператора <TH> вы можете создать такую строку заголовка.

Параметры этого оператора аналогичны только что рассмотренным параметрам оператора <TD>, поэтому мы не будем их приводить отдельно.