
- •Язык html. Основные понятия
- •Синтаксис html
- •Парные теги
- •Одиночные теги
- •Теги, атрибуты, значения
- •Структура html-документа
- •Вставка изображений в документ
- •Создание таблиц
- •Атрибуты таблицы
- •Сложные таблицы.
- •Нумерованные списки
- •Маркированные списки
- •Списки определений
- •Создание фреймов
- •Создание html-документа с плавающим фреймом
- •Каскадные таблицы стилей: назначение и возможности
- •Назначение каскадных таблиц стилей
- •Типы каскадных таблиц стилей
- •Создание файла сss
- •Атрибуты таблицы
- •Атрибуты тегов работы со списками
Создание таблиц
Код любой HTML-таблицы начинается с открывающего тега <table> и заканчивается тегом </table>. Для формирования строк и столбцов HTML-таблицы предназначены следующие теги:
• <tr> (Table Row) - горизонтальная строка;
• <td> (Table Data) - ячейки в пределах этой строки;
<table>
<tr> |
<td> |
</td> |
<td> |
</td> |
</tr> |
<tr> |
<td> |
</td> |
<td> |
</td> |
</tr> |
</table>
<table>
<tr><td>Cтoлбeцl</td><td>Cтолбец2</td></tr>
<tr><td>Cтpoкa2</td><td>Cтpoкa2</td></tr>
<tr><td>Cтpoкa3</td><td>Cтpoкa3</td></tr>
</table>
Атрибуты таблицы
Разнообразные атрибуты стиля HTML-таблицы приведены в таблице.
Атрибуты стиля HTML-таблицы
Атрибут |
Значение пo умолчанию |
Применение |
Значения |
align |
left |
Все теги таблицы. Выравнивание по горизонтали содержимого ячейки. |
Возможные значения: left, right, center. |
bgcolor |
Фон отсутствует |
Все теги таблицы |
Цвет фона |
border |
0 |
<table> |
Ширина границы (в пикселях) |
cellpadding |
0 |
<td> |
Расстояние между границей ячейки и ее содержимым (в пикселях) |
cellspacing |
0 |
<td> |
Расстояние между ячейками (в пикселях) |
colspan |
1 |
<td> |
Количество столбцов, которые необходимо объединить в один |
rowspan |
1 |
<td> |
Количество строк, которые необходимо объединить в одну |
Rulers |
none |
<table> |
Линии между ячейками таблицы. Возможные значения: rows, cols и all |
Valign |
center |
<tr>, <td> |
Выравнивание содержимого ячеек по вертикали. Возможные значения: top, bottom и baseline |
Width |
По ширине страницы |
Все теги таблицы |
Ширина таблицы или определенных ячеек (в пикселях или в процентах по отношению к ширине страницы) |
Сложные таблицы.
Во время создания HTML-таблицы очень полезными могут быть два атрибута - colspan и rowspan. Что касается сложных таблиц, то их построение без этих двух атрибутов невозможно. Атрибуты colspan и rowspan предназначены для объединения соответственно нескольких столбцов или строк HTML-таблицы в одну ячейку. Ниже приведен пример разметки сложной таблицы:
<table width="100%" border="l">
<tr><td со1sраn="2">Столбцы 1 и 2 oбъeдинeны</td></tr>
<tr><td align="center">Cтpoкa 2</td><td rowspan="2">Стpoка 2 и 3 oбъeдинeны</td></tr>
<tr><td align="center">Cтpoкa 3</td>
</table>
Вывод этой разметки браузером показан на рисунке.
Нумерованные списки
В данном случае Обозреватель автоматически будет проставлять числа перед каждым элементом списка. Начинается пронумерованный список с тэга <OL> и завершается тэгом </OL>. Например:
<OL> <LI> Один <LI> Два <LI> Три <LI> Четыре <LI> Пять </OL> |
|
Тэг <OL> может иметь следующие атрибуты:
TYPE - вид счетчика:
A - большие латинские буквы
a - маленькие латинские буквы
I - большие римские цифры
i - маленькие римские цифры
1 - обычные цифры
START - устанавливает число, с которого будет начинатся отсчет.
Следующий пример отображает список, пронумерованный большими латинскими буквами и начинающийся с восьмой цифры:
<OL TYPE="I" START="8"> <LI> Восемь <LI> Девять <LI> Десять <LI> Одиннадцать <LI> Двенадцать </OL> |
|