Перейти на главную   
  helloworld.ru - документация и книги по программированию  
helloworld.ru - документация и книги по программированию
    главная     хостинг    
Поиск по сайту:  
Смотрите также
Языки программирования
C#
MS Visual C++
Borland C++
C++ Builder
Visual Basic
Quick Basic
Turbo Pascal
Delphi
JavaScript
Java
PHP
Perl
Assembler
AutoLisp
Fortran
Python
1C

Интернет-технологии
HTML
VRML
HTTP
CGI
FTP
Proxy
DNS
протоколы TCP/IP
Apache

Web-дизайн
HTML
Дизайн
VRML
PhotoShop
Cookie
CGI
SSI
CSS
ASP
PHP
Perl

Программирование игр
DirectDraw
DirectSound
Direct3D
OpenGL
3D-графика
Графика под DOS

Алгоритмы
Численные методы
Обработка данных

Сис. программирование
Драйверы

Базы данных
MySQL
SQL

Другое

Хостинг


Друзья
demaker.ru
Реклама

Лучший хостинг. Аренда серверов




helloworld.ru

Таблицы

Основные тэги таблиц и их атрибуты
Размещение данных внутри ячеек
Объединение ячеек
Новые атрибуты таблиц
Использование цветов

Основные тэги таблиц и их атрибуты

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

Элемент TABLE представляет собой тэг-контейнер, в котором размещается содержимое таблицы. Этот контейнер напоминает контейнер списка.

Таблица строится по строкам: для обозначения строки используется контейнер TR, для обозначения заголовков столбцов (строк) - контейнер TH, а для данных в ячейках - контейнер TD. Заголовки выделяются полужирным шрифтом и центрируются в своих ячейках. Данные имеют обычный шрифт и выравниваются по левой стороне ячейки. Ниже приведен список основных тэгов таблиц:

  • <TABLE></TABLE> - контейнер таблицы.

  • <TR></TR> - контейнер строки таблицы. Допускается отсутствие закрывающего тэга.

  • <TD></TD> - контейнер ячейки таблицы. В ячейку можно включить другую таблицу. Закрывающий тэг может быть опущен.

  • <TH></TH> - контейнер заголовка, располагающегося обычно в первой строке, либо в первом столбце таблицы. Закрывающий тэг необязателен.

В дополнение к этим тэгам используются следующие атрибуты:

  • BORDER тэга <TABLE> - для определения рамки таблицы. Ширина рамки устанавливается в пикселах, например BORDER=1 (значение, равное нулю, означает отсутствие рамки).

  • ALIGN тэга <TABLE> - для выравнивания таблицы в окне браузера. Имеет значения LEFT, CENTER и RIGHT (по умолчанию - LEFT).

Ниже приведен фрагмент HTML - кода и его интерпретация браузером

<TABLE BORDER=1>
  <TR>
    <TD> Item1 </TD>
    <TD> Item2</TD>
  </TR>
  <TR>
    <TD> Item3 </TD>
    <TD> Item4 </TD>
  </TR>
</TABLE>

Item1 Item2
Item3 Item4

Наличие в ячейках данных необязательно. Создать пустую ячейку можно двумя способами: ничем не заполнять ее контейнер (<TD></TD>), любо заполнить ее специальным символом пустого пространства &nbsp; (<TD>&nbsp;</TD>). При выводе пустых ячеек браузер Microsoft Internet Explorer объединяет их. Ячейки с невидимым содержанием выводятся раздельно.

Размещение данных внутри ячеек

При помощи атрибутов ALIGN и VALIGN можно по-разному размещать данные относительно границ ячейки. Эти атрибуты используются совместно с элементами <CAPTION>, <TR>, <TH> и <TD> в самых различных комбинациях. Ниже приведены значения атрибутов для этих элементов:

  • <CAPTION> - атрибут ALIGN может иметь значения TOP и BOTTOM (по умолчанию - TOP); размещает заголовок таблицы сверху или снизу.

  • <TR> - атрибут ALIGN может принимать значения LEFT, CENTER и RIGHT (по умолчанию - LEFT для данных, CENTER для заголовков); он определяет горизонтальное выравнивание данных в ячейках и действует на всю строку, если он не отменяется тем же атрибутом в отдельной ячейке. Атрибут VALIGN может иметь значения TOP, BOTTOM, MIDDLE и BASELINE (по умолчанию - MIDDLE); он регулирует положения данных относительно верхней и нижней границ ячейки и влияет на всю строку, если не отменяется таким же атрибутом в отдельной ячейке. BASELINE применяется ко всем элементам строки и выравнивает их по базовой линии.

  • <TH> - атрибут ALIGN может принимать значения LEFT, CENTER и RIGHT ( по умолчанию - CENTER). Атрибут VALIGN может иметь значения TOP, BOTTOM и MIDDLE (по умолчанию - MIDDLE).

  • <TD> - атрибут ALIGN может принимать значения LEFT, CENTER и RIGHT (по умолчанию - LEFT). Атрибут VALIGN может иметь значения TOP, BOTTOM и MIDDLE (по умолчанию - MIDDLE ).

Объединение ячеек

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

Для соединения двух смежных ячеек в одном столбце нужно использовать атрибут ROWSPAN тэга <TH> или <TD>, например:

<TD ROWSPAN=2>

Для объединения двух смежных ячеек в одной строке нужно использовать атрибут COLSPAN тех же тэгов, например:

<TD COLSPAN=2>

Новые атрибуты таблиц

В HTML версии 3.2 введены несколько новых атрибутов таблиц. Ниже приведен их список:

  • WIDTH - определяет ширину всей таблицы в пикселах, либо в процентах от ширины окна браузера. Может также использоваться для отдельной ячейки.

  • HEIGHT - определяет высоту всей таблицы в пикселах, либо в процентах от ширины окна браузера. Может также использоваться для отдельной ячейки.

  • BORDER - устанавливает ширину рамки в пикселах.

  • CELLPADDING и CELLSPACING - добавляют свободное пространство между данными внутри ячейки и ее границами и, соответственно, между ячейками внутри всей таблицы. Если рамка отсутствует, то результат их действия одинаков.

Использование цветов

Тэги <TABLE>, <TD>, <TH> и <TR> допускают использование атрибутов BGCOLOR и BORDERCOLOR для изменения цвета отдельных ячеек или всей таблицы.


[ Оглавление ]









helloworld.ru © 2001-2021
Все права защищены
Rambler's Top100