ЛУЧШИЙ САЙТ ДЛЯ ВЕБ-РАЗРАБОТЧИКОВ
HTML5. Уроки для начинающих. W3Schools на русском

Ua En Es De Fr

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


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


     
     
     
     
     
     
     
     

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


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

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

Пример

Установить ширину таблицы на 100%:

<table style="width:100%">
  <tr>
    <th>Ім'я</th>
    <th>Прізвище</th>
    <th>Вік</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</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>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
</table>
Попробуйте сами »

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

     
     
     

Чтобы установить высоту определенной строки, добавьте атрибут style к элементу строки таблицы:

Пример

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

<table style="width:100%">
  <tr>
    <th>Ім'я</th>
    <th>Прізвище</th>
    <th>Вік</th>
  </tr>
  <tr style="height:200px">
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
</table>
Попробуйте сами »

HTML Упражнения

Проверьте себя с помощью упражнений

Упражнение:

Используйте CSS стили, чтобы сделать таблицу шириной 300 пикселей.

<table >
  <tr>
    <th>Имя</th>
    <th>Фамилия</th>
    <th>Балы</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
</table>