Урок 4.1: Таблицы в HTML

В современном мире очень мало людей не используют  таблицы. В школе, журнал оценок в классе, имеет вид таблицы - колонка "ФИО ученика", колонки с оценками. Дневники тоже имеют вид таблиц - Колонка "день недели", колонка "список предметов", колонка "домашнее задание", колонка оценки.

Язык HTML тоже может создавать таблицы. Первые дизайны сайтов создавались именно с помощью таблиц.

А как же создать таблицу в HTML?

Для создания таблицы в HTML, для этого, предназначены теги:

  • <table>...</table> - указывает на начало и конец таблицы
  • <tr>...</tr> - начало и конец строки
  • <td>...</td> - ячейка таблицы

Пример

<html>  <head>    <title>Создания таблицы</title>  </head>  <body>   <table border="1">    <tr>     <td>Ячейка 1</td>     <td>Ячейка 2</td>     <td>Ячейка 3</td>    </tr>    <tr>     <td>Ячейка 4</td>      <td>Ячейка 5</td>     <td>Ячейка 6</td>    </tr>   </table>  </body> </html>

Результат

Таблица в HTML

Атрибут border отвечает за размеры рамки вокруг таблицы. Если его не указывать - то таблица будет без рамки и визуально не будет таблицей (извините за каламбур).

Таблица без атрибута border

Для указания величины рамки указывают атрибутеру border размер в цифрах. Чем больше цифра - тем больше ширина рамки.

<html>  <head>    <title>Создания таблицы</title>  </head>  <body>   <table border="3">    <tr>     <td>Ячейка 1</td>     <td>Ячейка 2</td>     <td>Ячейка 3</td>    </tr>    <tr>     <td>Ячейка 4</td>      <td>Ячейка 5</td>     <td>Ячейка 6</td>    </tr>   </table>  </body> </html>

Таблица с атрибутом border=3

<< Формат изображений | Перечень уроков | Ширина, высота таблицы >>