Вы здесь: Главная > HTML > Таблицы

Таблицы

Таблицы HTML иногда ещё используются для оформления структуры страниц сайта. Мы рассмотрим, как сверстать страницу без таблиц, в промежуточном руководстве по CSS. Правильное назначение таблиц — структурирование табличных данных.

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

Скопируйте следующий код в текст вашего HTML-документа, а затем мы рассмотрим, что делает каждый тег:

<table>
    <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>
    <tr>
        <td> Строка 3, ячейка 1</td>
        <td> Строка 3, ячейка 2</td>
        <td> Строка 3, ячейка 3</td>
    </tr>
    <tr>
        <td> Строка 4, ячейка 1</td>
        <td> Строка 4, ячейка 2</td>
        <td> Строка 4, ячейка 3</td>
    </tr>
</table>

Элемент table определяет таблицу.

Элемент tr определяет строку таблицы.

Элемент td определяет ячейку данных. Элементы td должны быть заключены в tr теги, как показано выше.

Если вы представите таблицу размером 3×4, состоящую из 12 ячеек, в ней должно быть четыре tr элемента для определения строк и по три td элемента внутри каждой из строк, итого получается 12 td элементов.

Страницы в тему:

  • Следующая страница: Формы
  • Предыдущая страница: Изображения
  • Таблицы (Продвинутый урок по HTML): немного подробнее, в том числе о том, как объединять ячейки.
  • HTML-тег: table
  • HTML-тег: tr
  • HTML-тег: td

Примеры CSS

Добавить комментарий