Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
LR_informatika / лабораторки HTML №9.doc
Скачиваний:
13
Добавлен:
14.02.2016
Размер:
312.32 Кб
Скачать

Работа с таблицей

Таблицы с невидимой границей используются для верстки Web-страниц, позволяя разделять документ на модульные блоки.

Тег <TABLE> контейнер для элементов, определяющих содержимое таблицы. Внутри <TABLE> допустимо использовать следующие элементы: <CAPTION>, <COL>, <COLGROUP>, <TBODY>, <TD>, <TFOOT>, <TH>, <THEAD> и <TR>.

Параметры:

  • Align - Определяет выравнивание таблицы.

  • Background - Задает фоновый рисунок в таблице.

  • Bgcolor - Цвет фона таблицы.

  • Border - Толщина рамки в пикселях.

  • Bordercolor - Цвет рамки.

  • Cellpadding - Отступ от рамки до содержимого ячейки.

  • Cellspacing - Расстояние между ячейками.

  • Height - Высота таблицы.

  • Width - Ширина таблицы.

Тег <TR> служит контейнером для создания строки таблицы.

Параметры:

  • Align - Определяет выравнивание содержимого ячеек по горизонтали.

  • Bgcolor - Цвет фона ячеек.

  • Bordercolor - Цвет рамки.

  • Valign - Выравнивание содержимого ячеек по вертикали.

Тег <TD> предназначен для создания одной ячейки таблицы.

Параметры:

  • Align - Определяет выравнивание содержимого ячейки по горизонтали.

  • Background - Задает фоновый рисунок в ячейке.

  • Bgcolor - Цвет фона ячейки.

  • Bordercolor - Цвет рамки.

  • Colspan - Объединяет горизонтальные ячейки.

<td colspan="2">содержимое ячейки</td> - данной строкой было объединено 2-е горизонтальные ячейки. Выглядеть это будет так:

содержимое ячейки

  • Height - Высота ячейки.

  • Rowspan - Объединяет вертикальные ячейки.

  • Valign - Выравнивание содержимого ячейки по вертикали.

  • Top - Выравнивание содержимого ячейки по верхнему краю строки.

  • Middle - Выравнивание по середине.

  • Bottom - Выравнивание по нижнему краю.

  • Baseline - Выравнивание по базовой линии, при этом происходит привязка содержимого ячейки к одной линии.

  • Width - Ширина ячейки.

Пример.

Создадим таблицу шириной 200 px и толщенной рамки 1 px, содержащую две строки и три столбца, в которой объединены ячейки верхней строки. Для отображения в браузере ячеек, не содержащих информацию, используются специальные символы «&nbsp;». Без использования этих символов, отображение таблицы может быть некорректным.

<table width="200px" border="1px">

<tr>

<td colspan="3">&nbsp;</td>

</tr>

<tr>

<td>&nbsp;</td>

<td> </td>

<td> </td>

</tr>

</table>

Работа с изображениями.

Тег <IMG> предназначен для отображения на Web-странице изображений в графическом формате GIF, JPEG или PNG.

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

Параметры:

  • Align - Определяет, как рисунок будет выравниваться по краю и способ обтекания текстом.

  • Bottom - Выравнивание нижней границы изображения по окружающему тексту.

  • Left - Выравнивает изображение по левому краю окна.

  • Middle - Выравнивание середины изображения по базовой линии текущей строки.

  • Right - Выравнивает изображение по правому краю окна.

  • Top - Верхняя граница изображения выравнивается по самому высокому элементу текущей строки.

  • Alt - Альтернативный текст для изображения (если изображение по каким-либо причинам будет отсутствовать, то вместо него будет выведен текст)

  • Border - Толщина рамки вокруг изображения.

  • Height - Высота изображения.

  • Width - Ширина изображения.

  • Hspace - Горизонтальный отступ от изображения до окружающего контента.

  • Vspace - Вертикальный отступ от изображения до окружающего контента.

  • Lowsrc - Путь к графическому файлу низкого разрешения для предварительного отображения.

  • Src - Путь к графическому файлу.