HTML Размеры таблицы

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

Чтобы задать размер таблицы, строки или столбца, используйте атрибут style вместе со свойствами width или height.

Ширина HTML таблицы

Для задания ширины таблицы добавьте атрибут style к элементу <table>:

Пример
Задаем ширину таблицы равной 100%:

<table style="width:100%">
  <tr>
    <th>Имя</th>
    <th>Фамилия</th>
    <th>Возраст</th>
  </tr>
  <tr>
    <td>Джилл</td>
    <td>Смит</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Ива</td>
    <td>Джексон</td>
    <td>94</td>
  </tr>
</table>

Примечание: Использование процентов в качестве единицы измерения ширины означает, насколько широк этот элемент относительно родительского элемента, которым в данном примере является элемент <body>.

Ширина столбца HTML таблицы

Чтобы задать размер конкретного столбца, добавьте атрибут style к элементу <th> или <td>:

Пример

Задаем ширину первого столбца равную 70%:

<table style="width:100%">
  <tr>
    <th style="width:70%">Имя</th>
    <th>Фамилия</th>
    <th>Возраст</th>
  </tr>
  <tr>
    <td>Джилл</td>
    <td>Смит</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Ива</td>
    <td>Джексон</td>
    <td>94</td>
  </tr>
</table>

Высота строки HTML таблицы

Чтобы задать высоту конкретной строки, добавьте атрибут style к элементу строки (<tr>).

Пример

Задать высоту второй строки равную 200 пикселей:

<table style="width:100%">
  <tr>
    <th>Имя</th>
    <th>Фамилия</th>
    <th>Возраст</th>
  </tr>
  <tr style="height:200px">
    <td>Джилл</td>
    <td>Смит</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Ива</td>
    <td>Джексон</td>
    <td>94</td>
  </tr>
</table>