В web-дизайне таблицы являются одним из основных методов структурирования информации. Они представляют данные в виде удобных для восприятия колонок и строк, что значительно упрощает анализ информации. С их помощью можно легко отделить одну часть страницы от другой.
Основным тегом для обозначения таблицы является <table>. Элемент TABLE представляет собой тег-контейнер, в котором размещается содержимое таблицы. Построение таблицы осуществляется по строкам, для обозначения которых применяется контейнер TR. Внутри контейнера строк помещаются контейнеры для обозначения ячеек. Стандарт HTML определяет два типа контейнеров для обозначения ячеек <th> и <td>. Первый предназначен для обозначения заголовков, а второй для данных в ячейках. Отличие этих двух элементов заключается лишь в том как их содержимое отображается браузером, заголовки большинство браузеров выделяют полужирным шрифтом и центрируют в своих ячейках. Ячейка данных может содержать текст, изображения, списки, параграфы, формы, горизонтальные линейки, таблицы и т. д.
Рассмотрим вышеизложенное на примерах различного вида таблиц.
<html> <body> <p> Каждая таблица начинается с тега table. Каждая строка таблицы начинается с тега tr. Каждый элемент данных таблицы начинается с тега td. </p> <h1>Это пример простейшей таблицы, содержащей одну строку и одну ячейку.</h1> <table border="1"> <tr> <td>Одна строка и одна ячейка</td> </tr> </table> <h1>Одна строка и три столбца:</h1> <table border="1"> <tr> <td> столбец 1</td> <td> столбец 2</td> <td> столбец 3</td> </tr> </table> <h1>Две строки и три столбца:</h1> <table border="1"> <tr> <td>1.1</td> <td>1.2</td> <td>1.3</td> </tr> <tr> <td>2.1</td> <td>2.2</td> <td>2.3</td> </tr> </table> <h1>Рамка таблицы</h1> <h1>Обычная рамка:</h1> <table border="1"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая </td> <td>строка</td> </tr> </table> <h1>Толстая рамка:</h1> <table border="10"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая </td> <td>строка</td> </tr> </table> <table border="1"> <tr> <td>строка 1, ячейка 1</td> <td>строка 1, ячейка 2</td> </tr> <tr> <td>строка 2, ячейка 1</td> <td>строка 2, ячейка 2</td> </tr> </table> </body> </html>
Пример выполнения данного HTML-кода
Для тега table определены следующие атрибуты.
align - определяет способ горизонтального выравнивания таблицы на странице. Возможные значения: left, center, right. Значение по умолчанию - left.valign - должен определять способ вертикального выравнивания для содержимого таблицы. Возможные значения: top, bottom, middle.border - определяет ширину внешней рамки таблицы (в пикселах). При BORDER="0" или при отсутствии этого параметра рамка отображаться не будет.cellpadding - определяет расстояние (в пикселах) между рамкой каждой ячейки таблицы и содержащимся в ней материалом.cellspacing - определяет расстояние (в пикселах) между границами соседних ячеек.width - определяет ширину таблицы. Ширина задается либо в пикселах, либо в процентном отношении к ширине окна браузера. По умолчанию этот параметр определяется автоматически в зависимости от объема содержащегося в таблице материала.height - определяет высоту таблицы. Высота задается либо в пикселах, либо в процентном отношении к высоте окна браузера. По умолчанию этот параметр определяется автоматически в зависимости от объема содержащегося в таблице материала.bgcolor - определяет цвет фона ячеек таблицы. Задается либо RGB-значением в шестнадцатиричной системе, либо одним из 16 базовых цветов.background - позволяет заполнить фон таблицы рисунком. В качестве значения необходимо указать URL рисунка.Ячейки таблицы без содержимого в большинстве браузеров выводятся не очень хорошо. Если необходимо сделать ячейку таблицы пустой, то разместите в ней неразрывный пробел nbsp;
Такие элементы как <thead>, <tbody> и <tfoot> используются редко в связи с тем, что не все браузеры их поддерживают.
Для тегов <td> и <th> очень полезными являются атрибуты colspan и rowspan. Первый показывает сколько ячеек надо объединить по горизонтали, а второй по вертикали. Следует заметить, что если мы применяем объединение ячеек, то общее число ячеек с учетом объединенных должно быть равным. Продемонстрируем на примере.
<html> <body> <h4>Правильное применение colspan:</h4> <table border="1"> <tr> <td colspan="2">100</td> <td>300</td> </tr> <tr> <td>400</td> <td>500</td> <td>600</td> </tr> </table> <h4>Неправильное применение colspan:</h4> <table border="1"> <tr> <td colspan="2">100</td> <td>200</td> <td>300</td> </tr> <tr> <td>400</td> <td>500</td> <td>600</td> </tr> </table> <h4>Правильное применение rowspan:</h4> <table border="1"> <tr> <td rowspan="2">100</td> <td>200</td> <td>300</td> </tr> <tr> <td>500</td> <td>600</td> </tr> </table> <h4>Неправильное применение rowspan:</h4> <table border="1"> <tr> <td rowspan="2">100</td> <td>200</td> <td>300</td> </tr> <tr> <td>400</td> <td>500</td> <td>600</td> </tr> </table> </body> </html>
<html> <body> <h4>Эта таблица не имеет рамки:</h4> <table> <tr> <td>100</td> <td>200</td> <td>300</td> </tr> <tr> <td>400</td> <td>500</td> <td>600</td> </tr> </table> <h4>И эта таблица не имеет рамки:</h4> <table border="0"> <tr> <td>100</td> <td>200</td> <td>300</td> </tr> <tr> <td>400</td> <td>500</td> <td>600</td> </tr> </table> </body> </html>
Пример выполнения данного HTML-кода
<html> <body> <h4>Заголовки таблицы:</h4> <table border="1"> <tr> <th>Имя </th> <th>Телефон </th> <th>Телефон </th> </tr> <tr> <td>Калиткин</td> <td>202 55 55 </td> <td>456 77 84 </td> </tr> </table> <h4>Вертикальные заголовки:</h4> <table border="1"> <tr> <th>Фамилия:</th> <td>Калиткин</td> </tr> <tr> <th>Телефон :</th> <td>202 55 55</td> </tr> <tr> <th>Телефон:</th> <td>456 77 84</td> </tr> </table> </body> </html>
Пример выполнения данного HTML-кода
<html>
<body>
<table border="1">
<tr>
<td>Некоторый текст </td>
<td>Некоторый текст </td>
</tr>
<tr>
<td></td>
<td>Некоторый текст </td>
</tr>
</table>
<p>
Как можно видеть, одна из ячеек не имеет рамки.
Это потому, что она пустая. Попробуйте вставить в ячейку пробел.
Она по-прежнему не будет иметь рамки.
</p>
<p>
Хитрость состоит в том, чтобы вставить в ячейку неразрывный пробел.
</p>
<p>Неразрывный пробел является символьным объектом.
</p>
<p>Объект неразрывного пробела начинается с амперсанда (""),
затем следуют буквы "nbsp", и в конце стоит точка с запятой (";")
</p>
<p>
</p>
</body>
</html>
<html> <body> <h4> Эта таблица имеет заглавие и толстую рамку: </h4> <table border="6"> <caption>Заглавие</caption> <tr> <td>100</td> <td>200</td> <td>300</td> </tr> <tr> <td>400</td> <td>500</td> <td>600</td> </tr> </table> </body> </html>
Пример выполнения данного HTML-кода
<html> <body> <h4>Ячейка, которая охватывает два столбца:</h4> <table border="1"> <tr> <th>Организация</th> <th colspan="2">Телефон</th> </tr> <tr> <td>Интернет-Университет Информационных Технологий</td> <td>253-9312</td> <td>253-9313</td> </tr> </table> <h4>Ячейка, которая охватывает две строки:</h4> <table border="1"> <tr> <th>Организация:</th> <td> Интернет-Университет Информационных Технологий </td> </tr> <tr> <th rowspan="2">Телефон:</th> <td>253-9312</td> </tr> <tr> <td>253-9313</td> </tr> </table> </body> </html>
Пример выполнения данного HTML-кода
<html>
<body>
<table border="1">
<tr>
<td>
<p>Это параграф </p>
<p>Это другой параграф </p>
</td>
<td>Эта ячейка содержит таблицу:
<table border="1">
<tr>
<td>A</td>
<td>B</td>
</tr>
<tr>
<td>C</td>
<td>D</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>Эта ячейка содержит список
<ul>
<li>элемент 1</li>
<li>элемент 2</li>
<li>элемент 3</li>
</ul>
</td>
<td>КОНЕЦ</td>
</tr>
</table>
</body>
</html>
Пример выполнения данного HTML-кода
<html> <body> <h4>Без отступа:</h4> <table border="1"> <tr> <td>Первая </td> <td>Строка</td> </tr> <tr> <td>Вторая </td> <td>Строка</td> </tr> </table> <h4>С отступом (cellpadding) :</h4> <table border="1" cellpadding="10"> <tr> <td>Первая</td> <td>Строка</td> </tr> <tr> <td>Вторая</td> <td>Строка</td> </tr> </table> </body> </html>
<html> <body> <h4>Расстояние между ячейками не задано:</h4> <table border="1"> <tr> <td>Первая </td> <td>Строка </td> </tr> <tr> <td>Вторая </td> <td>Строка </td> </tr> </table> <h4>Расстояние между ячейками (cellspacing) задано:</h4> <table border="1" cellspacing="10"> <tr> <td>Первая </td> <td>Строка</td> </tr> <tr> <td>Вторая </td> <td>Строка </td> </tr> </table> </body> </html>
Пример выполнения данного HTML-кода
<html> <body> <h4>Фоновый цвет (bgcolor):</h4> <table border="1" bgcolor="red"> <tr> <td>Первая </td> <td>Строка </td> </tr> <tr> <td>Вторая </td> <td>Строка </td> </tr> </table> <h4>Фоновое изображение (background):</h4> <table border="1" background="bg.jpg"> <tr> <td>Первая</td> <td>Строка</td> </tr> <tr> <td>Вторая </td> <td>Строка </td> </tr> </table> </body> </html>
Пример выполнения данного HTML-кода
<html> <body> <h4>Ячейки с фоном:</h4> <table border="1"> <tr> <td bgcolor="red">Первая</td> <td>Строка</td> </tr> <tr> <td background="bg.jpg"> Вторая</td> <td>Строка</td> </tr> </table> </body> </html>
Пример выполнения данного HTML-кода
<html> <body> <table width="360" border="1"> <tr> <th align="left">Опубликовано курсов</th> <th align="center">2004</th> <th align="center">2005</th> </tr> <tr> <td align="left">Базы данных</td> <td align="center">2</td> <td align="center">3</td> </tr> <tr> <td align="left">Программирование</td> <td align="center">4</td> <td align="center">5</td> </tr> <tr> <td align="left">Интернет-технологии</td> <td align="right">2</td> <td align="right">3</td> </tr> <tr> <th align="left">всего</th> <th align="right">8</th> <th align="right">11</th> </tr> </table> </body> </html>
<html> <body> <p> Если никакие границы кадра таблицы в этих примерах не видны, то используемый браузер слишком старый, или не поддерживает их. </p> <h4> frame="border":</h4> <table frame="border"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая </td> <td>строка</td> </tr> </table> <h4> frame="box":</h4> <table frame="box"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая </td> <td>строка</td> </tr> </table> <h4>frame="void":</h4> <table frame="void"> <tr> <td>Первая </td> <td>строка</td> </tr> <tr> <td>Вторая</td> <td>строка</td> </tr> </table> <h4>frame="above":</h4> <table frame="above"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая</td> <td>строка</td> </tr> </table> <h4>frame="below":</h4> <table frame="below"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая</td> <td>строка</td> </tr> </table> <h4>frame="hsides":</h4> <table frame="hsides"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая</td> <td>строка</td> </tr> </table> <h4>frame="vsides":</h4> <table frame="vsides"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая</td> <td>строка</td> </tr> </table> <h4>frame="lhs":</h4> <table frame="lhs"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая</td> <td>строка</td> </tr> </table> <h4>frame="rhs":</h4> <table frame="rhs"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая</td> <td>строка</td> </tr> </table> </body> </html>
Пример выполнения данного HTML-кода
| Тег | Описание |
|---|---|
<table> |
Определяет таблицу |
<th> |
Определяет заголовки в таблице |
<tr> |
Определяет строку таблицы |
<td> |
Определяет ячейку таблицы |
<caption> |
Определяет заглавие таблицы |
<colgroup> |
Определяет группы столбцов таблицы |
<col> |
Определяет значения атрибутов для одного или нескольких столбцов таблицы |
<thead> |
Определяет заголовок группы строк таблицы |
<tbody> |
Определяет тело группы строк таблицы |
<tfoot> |
Определяет нижний заголовок группы строк таблицы |
В web-дизайне таблицы являются одним из основных методов структурирования информации. Они представляют данные в виде удобных для восприятия колонок и строк, что значительно упрощает анализ информации. С их помощью можно легко отделить одну часть страницы от другой.
Основным тегом для обозначения таблицы является <table>. Элемент TABLE представляет собой тег-контейнер, в котором размещается содержимое таблицы. Построение таблицы осуществляется по строкам, для обозначения которых применяется контейнер TR. Внутри контейнера строк помещаются контейнеры для обозначения ячеек. Стандарт HTML определяет два типа контейнеров для обозначения ячеек <th> и <td>. Первый предназначен для обозначения заголовков, а второй для данных в ячейках. Отличие этих двух элементов заключается лишь в том как их содержимое отображается браузером, заголовки большинство браузеров выделяют полужирным шрифтом и центрируют в своих ячейках. Ячейка данных может содержать текст, изображения, списки, параграфы, формы, горизонтальные линейки, таблицы и т. д.
Рассмотрим вышеизложенное на примерах различного вида таблиц.
<html> <body> <p> Каждая таблица начинается с тега table. Каждая строка таблицы начинается с тега tr. Каждый элемент данных таблицы начинается с тега td. </p> <h1>Это пример простейшей таблицы, содержащей одну строку и одну ячейку.</h1> <table border="1"> <tr> <td>Одна строка и одна ячейка</td> </tr> </table> <h1>Одна строка и три столбца:</h1> <table border="1"> <tr> <td> столбец 1</td> <td> столбец 2</td> <td> столбец 3</td> </tr> </table> <h1>Две строки и три столбца:</h1> <table border="1"> <tr> <td>1.1</td> <td>1.2</td> <td>1.3</td> </tr> <tr> <td>2.1</td> <td>2.2</td> <td>2.3</td> </tr> </table> <h1>Рамка таблицы</h1> <h1>Обычная рамка:</h1> <table border="1"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая </td> <td>строка</td> </tr> </table> <h1>Толстая рамка:</h1> <table border="10"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая </td> <td>строка</td> </tr> </table> <table border="1"> <tr> <td>строка 1, ячейка 1</td> <td>строка 1, ячейка 2</td> </tr> <tr> <td>строка 2, ячейка 1</td> <td>строка 2, ячейка 2</td> </tr> </table> </body> </html>
Пример выполнения данного HTML-кода
Для тега table определены следующие атрибуты.
align - определяет способ горизонтального выравнивания таблицы на странице. Возможные значения: left, center, right. Значение по умолчанию - left.valign - должен определять способ вертикального выравнивания для содержимого таблицы. Возможные значения: top, bottom, middle.border - определяет ширину внешней рамки таблицы (в пикселах). При BORDER="0" или при отсутствии этого параметра рамка отображаться не будет.cellpadding - определяет расстояние (в пикселах) между рамкой каждой ячейки таблицы и содержащимся в ней материалом.cellspacing - определяет расстояние (в пикселах) между границами соседних ячеек.width - определяет ширину таблицы. Ширина задается либо в пикселах, либо в процентном отношении к ширине окна браузера. По умолчанию этот параметр определяется автоматически в зависимости от объема содержащегося в таблице материала.height - определяет высоту таблицы. Высота задается либо в пикселах, либо в процентном отношении к высоте окна браузера. По умолчанию этот параметр определяется автоматически в зависимости от объема содержащегося в таблице материала.bgcolor - определяет цвет фона ячеек таблицы. Задается либо RGB-значением в шестнадцатиричной системе, либо одним из 16 базовых цветов.background - позволяет заполнить фон таблицы рисунком. В качестве значения необходимо указать URL рисунка.Ячейки таблицы без содержимого в большинстве браузеров выводятся не очень хорошо. Если необходимо сделать ячейку таблицы пустой, то разместите в ней неразрывный пробел nbsp;
Такие элементы как <thead>, <tbody> и <tfoot> используются редко в связи с тем, что не все браузеры их поддерживают.
Для тегов <td> и <th> очень полезными являются атрибуты colspan и rowspan. Первый показывает сколько ячеек надо объединить по горизонтали, а второй по вертикали. Следует заметить, что если мы применяем объединение ячеек, то общее число ячеек с учетом объединенных должно быть равным. Продемонстрируем на примере.
<html> <body> <h4>Правильное применение colspan:</h4> <table border="1"> <tr> <td colspan="2">100</td> <td>300</td> </tr> <tr> <td>400</td> <td>500</td> <td>600</td> </tr> </table> <h4>Неправильное применение colspan:</h4> <table border="1"> <tr> <td colspan="2">100</td> <td>200</td> <td>300</td> </tr> <tr> <td>400</td> <td>500</td> <td>600</td> </tr> </table> <h4>Правильное применение rowspan:</h4> <table border="1"> <tr> <td rowspan="2">100</td> <td>200</td> <td>300</td> </tr> <tr> <td>500</td> <td>600</td> </tr> </table> <h4>Неправильное применение rowspan:</h4> <table border="1"> <tr> <td rowspan="2">100</td> <td>200</td> <td>300</td> </tr> <tr> <td>400</td> <td>500</td> <td>600</td> </tr> </table> </body> </html>
Пример выполнения данного HTML-кода
<html> <body> <h4>Эта таблица не имеет рамки:</h4> <table> <tr> <td>100</td> <td>200</td> <td>300</td> </tr> <tr> <td>400</td> <td>500</td> <td>600</td> </tr> </table> <h4>И эта таблица не имеет рамки:</h4> <table border="0"> <tr> <td>100</td> <td>200</td> <td>300</td> </tr> <tr> <td>400</td> <td>500</td> <td>600</td> </tr> </table> </body> </html>
Пример выполнения данного HTML-кода
<html> <body> <h4>Заголовки таблицы:</h4> <table border="1"> <tr> <th>Имя </th> <th>Телефон </th> <th>Телефон </th> </tr> <tr> <td>Калиткин</td> <td>202 55 55 </td> <td>456 77 84 </td> </tr> </table> <h4>Вертикальные заголовки:</h4> <table border="1"> <tr> <th>Фамилия:</th> <td>Калиткин</td> </tr> <tr> <th>Телефон :</th> <td>202 55 55</td> </tr> <tr> <th>Телефон:</th> <td>456 77 84</td> </tr> </table> </body> </html>
Пример выполнения данного HTML-кода
<html>
<body>
<table border="1">
<tr>
<td>Некоторый текст </td>
<td>Некоторый текст </td>
</tr>
<tr>
<td></td>
<td>Некоторый текст </td>
</tr>
</table>
<p>
Как можно видеть, одна из ячеек не имеет рамки.
Это потому, что она пустая. Попробуйте вставить в ячейку пробел.
Она по-прежнему не будет иметь рамки.
</p>
<p>
Хитрость состоит в том, чтобы вставить в ячейку неразрывный пробел.
</p>
<p>Неразрывный пробел является символьным объектом.
</p>
<p>Объект неразрывного пробела начинается с амперсанда (""),
затем следуют буквы "nbsp", и в конце стоит точка с запятой (";")
</p>
<p>
</p>
</body>
</html>
Пример выполнения данного HTML-кода
<html> <body> <h4> Эта таблица имеет заглавие и толстую рамку: </h4> <table border="6"> <caption>Заглавие</caption> <tr> <td>100</td> <td>200</td> <td>300</td> </tr> <tr> <td>400</td> <td>500</td> <td>600</td> </tr> </table> </body> </html>
Пример выполнения данного HTML-кода
<html> <body> <h4>Ячейка, которая охватывает два столбца:</h4> <table border="1"> <tr> <th>Организация</th> <th colspan="2">Телефон</th> </tr> <tr> <td>Интернет-Университет Информационных Технологий</td> <td>253-9312</td> <td>253-9313</td> </tr> </table> <h4>Ячейка, которая охватывает две строки:</h4> <table border="1"> <tr> <th>Организация:</th> <td> Интернет-Университет Информационных Технологий </td> </tr> <tr> <th rowspan="2">Телефон:</th> <td>253-9312</td> </tr> <tr> <td>253-9313</td> </tr> </table> </body> </html>
Пример выполнения данного HTML-кода
<html>
<body>
<table border="1">
<tr>
<td>
<p>Это параграф </p>
<p>Это другой параграф </p>
</td>
<td>Эта ячейка содержит таблицу:
<table border="1">
<tr>
<td>A</td>
<td>B</td>
</tr>
<tr>
<td>C</td>
<td>D</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>Эта ячейка содержит список
<ul>
<li>элемент 1</li>
<li>элемент 2</li>
<li>элемент 3</li>
</ul>
</td>
<td>КОНЕЦ</td>
</tr>
</table>
</body>
</html>
Пример выполнения данного HTML-кода
<html> <body> <h4>Без отступа:</h4> <table border="1"> <tr> <td>Первая </td> <td>Строка</td> </tr> <tr> <td>Вторая </td> <td>Строка</td> </tr> </table> <h4>С отступом (cellpadding) :</h4> <table border="1" cellpadding="10"> <tr> <td>Первая</td> <td>Строка</td> </tr> <tr> <td>Вторая</td> <td>Строка</td> </tr> </table> </body> </html>
Пример выполнения данного HTML-кода
<html> <body> <h4>Расстояние между ячейками не задано:</h4> <table border="1"> <tr> <td>Первая </td> <td>Строка </td> </tr> <tr> <td>Вторая </td> <td>Строка </td> </tr> </table> <h4>Расстояние между ячейками (cellspacing) задано:</h4> <table border="1" cellspacing="10"> <tr> <td>Первая </td> <td>Строка</td> </tr> <tr> <td>Вторая </td> <td>Строка </td> </tr> </table> </body> </html>
Пример выполнения данного HTML-кода
<html> <body> <h4>Фоновый цвет (bgcolor):</h4> <table border="1" bgcolor="red"> <tr> <td>Первая </td> <td>Строка </td> </tr> <tr> <td>Вторая </td> <td>Строка </td> </tr> </table> <h4>Фоновое изображение (background):</h4> <table border="1" background="bg.jpg"> <tr> <td>Первая</td> <td>Строка</td> </tr> <tr> <td>Вторая </td> <td>Строка </td> </tr> </table> </body> </html>
Пример выполнения данного HTML-кода
<html> <body> <h4>Ячейки с фоном:</h4> <table border="1"> <tr> <td bgcolor="red">Первая</td> <td>Строка</td> </tr> <tr> <td background="bg.jpg"> Вторая</td> <td>Строка</td> </tr> </table> </body> </html>
Пример выполнения данного HTML-кода
<html> <body> <table width="360" border="1"> <tr> <th align="left">Опубликовано курсов</th> <th align="center">2004</th> <th align="center">2005</th> </tr> <tr> <td align="left">Базы данных</td> <td align="center">2</td> <td align="center">3</td> </tr> <tr> <td align="left">Программирование</td> <td align="center">4</td> <td align="center">5</td> </tr> <tr> <td align="left">Интернет-технологии</td> <td align="right">2</td> <td align="right">3</td> </tr> <tr> <th align="left">всего</th> <th align="right">8</th> <th align="right">11</th> </tr> </table> </body> </html>
Пример выполнения данного HTML-кода
<html> <body> <p> Если никакие границы кадра таблицы в этих примерах не видны, то используемый браузер слишком старый, или не поддерживает их. </p> <h4> frame="border":</h4> <table frame="border"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая </td> <td>строка</td> </tr> </table> <h4> frame="box":</h4> <table frame="box"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая </td> <td>строка</td> </tr> </table> <h4>frame="void":</h4> <table frame="void"> <tr> <td>Первая </td> <td>строка</td> </tr> <tr> <td>Вторая</td> <td>строка</td> </tr> </table> <h4>frame="above":</h4> <table frame="above"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая</td> <td>строка</td> </tr> </table> <h4>frame="below":</h4> <table frame="below"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая</td> <td>строка</td> </tr> </table> <h4>frame="hsides":</h4> <table frame="hsides"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая</td> <td>строка</td> </tr> </table> <h4>frame="vsides":</h4> <table frame="vsides"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая</td> <td>строка</td> </tr> </table> <h4>frame="lhs":</h4> <table frame="lhs"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая</td> <td>строка</td> </tr> </table> <h4>frame="rhs":</h4> <table frame="rhs"> <tr> <td>Первая</td> <td>строка</td> </tr> <tr> <td>Вторая</td> <td>строка</td> </tr> </table> </body> </html>
Пример выполнения данного HTML-кода
| Тег | Описание |
|---|---|
<table> |
Определяет таблицу |
<th> |
Определяет заголовки в таблице |
<tr> |
Определяет строку таблицы |
<td> |
Определяет ячейку таблицы |
<caption> |
Определяет заглавие таблицы |
<colgroup> |
Определяет группы столбцов таблицы |
<col> |
Определяет значения атрибутов для одного или нескольких столбцов таблицы |
<thead> |
Определяет заголовок группы строк таблицы |
<tbody> |
Определяет тело группы строк таблицы |
<tfoot> |
Определяет нижний заголовок группы строк таблицы |
Для получения официальных документов о завершении программы дополнительного профессионального образования (удостоверения о повышении квалификации, дипломов о профессиональной переподготовке и MBA) необходимо предоставить:
Внимание! Вы можете не заказывать доставку бумажной версии официального документы, а скачать его в электронном виде и распечатать самостоятельно. Информация о выданном документе в течение 1 месяца загружается в Федеральную информационную систему «Федеральный реестр сведений о документах об образовании и (или) о квалификации, документах об обучении» - ФИС ФРДО.
Доступ на новый сайт осуществляется с использованием адреса электронной почты, который был указан вами при регистрации на "старом". Мы постарались перенести все ваши данные с прежнего ресурса, однако не исключена вероятность потери части информации.
При возникновении проблемы со входом, воспользуйтесь функцией сброса пароля
Если вы обнаружите несоответствия, пожалуйста, сообщите нам.