Главная страница
Случайная страница
КАТЕГОРИИ:
АвтомобилиАстрономияБиологияГеографияДом и садДругие языкиДругоеИнформатикаИсторияКультураЛитератураЛогикаМатематикаМедицинаМеталлургияМеханикаОбразованиеОхрана трудаПедагогикаПолитикаПравоПсихологияРелигияРиторикаСоциологияСпортСтроительствоТехнологияТуризмФизикаФилософияФинансыХимияЧерчениеЭкологияЭкономикаЭлектроника
|
Выравнивание данных в ячейках
Использование таблиц в HTML
Теги HTML для создания таблиц первоначально предназначались для представления строк и столбцов табулированных данных. Однако дизайнеры научились с их помощью управлять разметкой Web-страниц: создавать столбцы текста, задавать интервалы между элементами и изменять внешний вид текста способами, недоступными другим тегам форматирования HTML.
Таблицы в языке HTML всегда имеют прямоугольный вид и состоят из строк, которые в свою очередь состоят из ячеек. Все языковые конструкции, описывающие компоненты создаваемой таблицы, заключаются между тегами < TABLE> и < /TABLE>.
Заполнение таблицы происходит построчно; для обозначения строки используется пара тегов < TR> ...< /TR> . Строка состоит из ячеек, для задания которых используют либо теги < TH> ...< /TH> , если эти ячейки содержат заголовки столбцов, либо теги < TD> ...< /TD> . Заголовки выводятся полужирным шрифтом и располагаются по центру ячейки. Данные имеют обычный шрифт и выравниваются по левой стороне ячейки. Для задания заголовка всей таблицы используются теги < CAPTION> и < /CAPTION> .
Пример
< TABLE> < CAPTION> Заголовок таблицы< /CAPTION> < TR> < TH> Заголовок 1< /TH> < TH> Заголовок 2< /TH> < /TR> < TR> < TD> Ячейка 1< /TD> < TD> Ячейка 2< /TD> < /TR> < TR> < TD> Ячейка 3< /TD> < TD> Ячейка 4< /TD> < /TR> < /TABLE> 
Наличие в ячейках данных не обязательно. Создать пустую ячейку можно двумя способами: ничем не заполнять ее контейнер (< TD> < /TD> ), либо поместить в нее символ неразрывного пробела, задаваемого специальной последовательностью символов -- & nbsp; (т. е. создать ячейку вида < TD> & nbsp; < /TD> ).
Нет надобности отдельно создавать пустые ячейки, если планируется, что все оставшиеся в строке ячейки не будут заполнены. Так как тег < TR> сигнализирует о начале новой строки, пустые ячейки будут добавлены браузером автоматически.
Основные атрибуты тега < TABLE>
Назначение основных атрибутов тега < TABLE> и значения, которые они могут принимать перечислены в таблице.
Атрибут
| Назначение
| BORDER=n
| Определяет ширину рамки таблицы (в пикселах), например, BORDER=1; значение, равное нулю, означает отсутствие рамки
| WIDTH=n
| Определяет ширину всей таблицы в пикселах, либо в процентах от ширины окна браузера
| HEIGHT=n
| Определяет высоту всей таблицы в пикселах, либо в процентах от высоты окна браузера
| ALIGN
| Задает горизонтальное выравнивание таблицы в окне браузера; имеет значения left, center и right (по умолчанию -- left)
| CELLPADDING=n
| Добавляет свободное пространство между данными внутри ячейки и ее границами; по умолчанию значение равно 2
| CELLSPACING=n
| Добавляет свободное пространство между ячейками внутри всей таблицы; по умолчанию значение равно 2
| HSPACE=n
| Задает области свободного пространства указанной ширины (в пикселах) слева и справа от таблицы
| VSPACE=n
| Задает области свободного пространства заданной высоты (в пикселах) сверху и снизу от таблицы
| BGCOLOR=цвет
| Устанавливает цвет фона всей таблицы
| BACKGROUND=URL
| Указывает фоновое изображение для таблицы, где URL -- адрес источника (имя файла с изображением)
| Пример Изменим содержимое документа, созданного в предыдущем примере, добавив атрибуты BORDER и ALIGN в тег < TABLE> :
< TABLE BORDER=1 ALIGN=center> Теперь ячейки таблицы будут обрамлены рамкой, a таблица выровнена по центру окна браузера.

Выравнивание данных в ячейках
При помощи атрибутов ALIGN и VALIGN можно по-разному размещать данные относительно границ ячейки. Эти атрибуты используются совместно с тегами < CAPTION> , < TR> , < TH> и < TD> в самых различных комбинациях. Ниже приведены значения атрибутов для перечисленных элементов.
Тег
| Назначение атрибута
| < 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)
| < CAPTION>
| Атрибут ALIGN может иметь значения top и bottom (по умолчанию -- top); размещает заголовок таблицы сверху или снизу
|
|