Студопедия

Главная страница Случайная страница

КАТЕГОРИИ:

АвтомобилиАстрономияБиологияГеографияДом и садДругие языкиДругоеИнформатикаИсторияКультураЛитератураЛогикаМатематикаМедицинаМеталлургияМеханикаОбразованиеОхрана трудаПедагогикаПолитикаПравоПсихологияРелигияРиторикаСоциологияСпортСтроительствоТехнологияТуризмФизикаФилософияФинансыХимияЧерчениеЭкологияЭкономикаЭлектроника






Построение таблиц






Цель работы научить студентов:

  • использованию основных тегов по созданию таблиц,
  • создавать таблицы в HTML-документах,

Таблица определяется тегами < TABLE> и < /TABLE>, строки – < TR> и < /TR>, а отдельные столбцы в строке – < TD> и < /TD> или < ТН> и < /ТН>. Теги заголовков таблицы, находящихся в объединенных столбцах < ТН> и < /ТН> выпол­няют те же функции, что и теги ячеек < TD> < /TD>, но < ТН> < /ТН> предписы­вают броузеру назначить заключенному между ними тексту полужирное начертание.

Теги заглавия < CAPTION> < /CAPTION> задают заголовок таблицы. Определе­ние таблицы имеет следующий синтаксис:

< TABLE ALIGN=" align" BGCOLOR=" #rrggbb" BORDER=" integer"

BORDERCOLOR=" #rrggbb" CELLPADDING=" integer"

CELLSPACING=" integer" WIDTH=" integer" >

< /TABLE>

Вот их выполняемые функции:

ALIGN определяет выравнивание таблицы (по умолчанию — по левому краю). ALIGN может принимать одно из следующих значений: LEFT, CENTER, RIGHT.

BGCOLOR задает цвет фона (в шестнадцатеричном формате RGB или как одно из предопределенных названий цвета).

BORDER — целое число, задающее толщину рамки таблицы в пикселях. Если BORDER не определен, рамка не отображается.

BORDERCOLOR определяет цвет рамки (в шестнадцатеричном формате RGB или как одно из предопределенных названий); должен использо­ваться совместно с атрибутом BORDER.

CELLPADDING — целое число, задающее горизонтальное и вертикальное расстояние между данными в ячейке и рамкой ячейки. Задается в пикселях.

CELLSPACING — целое число, которое определяет горизонтальное и верти­кальное расстояние между ячейками. Задается в пикселях.

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

Заголовок определяется тегом < CAPTION> в соответствии со следующим синтаксисом:

< CAPTION ALIGN=" align" VALIGN=" valign" > < /CAPTION>

Tэг < CAPTION> имеет следующие атрибуты.

ALIGN определяет выравнивание заголовка и принимает одно из следующих значений: LEFT, CENTER (по умолчанию) или RIGHT.

VALIGN определяет вертикальное выравнивание заголовка и может прини­мать одно из следующих значений: ТОР, MIDDLE, BOTTOM (по умолчанию), BASELINE.

Строка таблицы определяется тегом < TR> < /TR>, который имеет свои атрибуты:

< TR ALIGN=" align" BGCOLOR=" #rrggbb" BORDERCOLOR=" #rrggbb" > Строка… < /TR>

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

ALIGN — выравнивание строки. Возможны следующие значения: LEFT (пo умолчанию), CENTER, RIGHT.

BGCOLOR определяет цвет фона (в шестнадцатеричном формате RGB или как одно из предопределенных названий).

BORDERCOLOR — цвет рамки строки (в шестнадцатеричном формате RGB или как одно из предопределенных названий). Этот атрибут будет использоваться только в том случае, если для атрибута BORDER тега < TABLE> определено значение, отличное от нуля.

Ячейки (столбцы) таблицы определяются тегами < TD> < /TD> и < ТН> < /ТН> в соот­ветствии со следующим синтаксисом:

< TD или ТН ALIGN=" align" BACKGROUND=" url" ] BGCOLOR=" #rrggbb" BORDERCOLOR=" #rrggbb" ] > Столбец… < /TD или /TН>

Теги < TD> и < ТН> имеют следующие атрибуты:

ALIGN — горизонтальное выравнивание текста. ALIGN может принимать одно из следующих значений: LEFT, CENTER (по умолчанию), RIGHT.

BGCOLOR — цвет фона (в шестнадцатеричном формате RGB или как одно из предопределенных названий).

BORDERCOLOR — цвет рамки ячейки (в шестнадцатеричном формате RGB или как одно из предопределенных названий цвета). Этот атрибут будет использоваться только в том случае, если для атрибута BORDER тега < TABLE> определено значение, отличное от нуля.

COLSPAN — целое число, определяющее количество столбцов, попадаю­щих в данную ячейку, предназначенную для заголовка столбцов.

Теперь рассмотрим задания.


Поделиться с друзьями:

mylektsii.su - Мои Лекции - 2015-2024 год. (0.008 сек.)Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав Пожаловаться на материал