Меню
×
   ❮     
HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP КАК СДЕЛАТЬ ПРОГРАММЫ SW3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY EXCEL XML DJANGO NUMPY PANDAS NODEJS R TYPESCRIPT ANGULAR GIT POSTGRESQL MONGODB ASP AI GO KOTLIN SASS VUE DSA GEN AI SCIPY AWS КИБЕРБЕЗОПАСНОСТЬ НАУКА О ДАННЫХ
     ❯   

HTML Учебники


HTML Формы


HTML Графика


HTML Медиа


HTML API Интерфейсы


HTML Примеры


HTML Ссылки



HTML Заголовки таблицы



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


EMIL TOBIAS LINUS
     
     
     
     
     
8:00    
9:00    
10:00    
11:00    
12:00    
13:00    
MON TUE WED THU FRI
8:00          
9:00          
10:00          
11:00          
12:00          
DECEMBER
     
     
     
     
     

Заголовки таблиц

Заголовки таблиц определяются с помощью th. Каждый th представляет ячейку таблицы.

<table>
  <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>
Попробуйте сами »

Вертикальные заголовки таблиц

Чтобы использовать первый столбец в качестве заголовков таблицы, определите первую ячейку в каждой строке элемента <th>:

<table>
  <tr>
    <th>Имя</th>
    <td>Андрей</td>
    <td>Татьяна</td>
  </tr>
  <tr>
    <th>Фамилия</th>
    <td>Щипунов</td>
    <td>Щипунова</td>
  </tr>
  <tr>
    <th>Год</th>
    <td>94</td>
    <td>50</td>
  </tr>
</table>
Попробуйте сами »


Выровнивание заголовка таблицы

По умолчанию заголовки таблиц выделены жирным шрифтом и по центру:

Имя Фамилия Год
Андрей Щипунов 50
Татьяна Щипунова 94

Чтобы выровнять заголовки таблиц по левому краю, используйте свойство CSS text-align:

th {
  text-align: left;
}
Попробуйте сами »

Заголовок для нескольких столбцов

У вас может быть заголовок, охватывающий два или более столбца.

Имя Год
Андрей Щипунов 50
Татьяна Щипунова 94

Для этого используйте атрибут colspan для элемента <th>:

<table>
  <tr>
    <th colspan="2">Имя</th>
    <th>Год</th>
  </tr>
  <tr>
    <td>Андрей</td>
    <td>Щипунов</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Татьяна</td>
    <td>Щипунова</td>
    <td>94</td>
  </tr>
</table>
Попробуйте сами »

Вы узнаете больше о colspan и rowspan в главе Таблица colspan и rowspan.


Заголовок таблицы

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

Ежемесячная экономия
Месяц Сбережения
Январь $100
Февраль $50

Чтобы добавить заголовок к таблице, используйте тег <caption>:

<table style="width:100%">
  <caption>Ежемесячная экономия</caption>
  <tr>
    <th>Месяц</th>
    <th>Сбережения</th>
  </tr>
  <tr>
    <td>Январь</td>
    <td>$100</td>
  </tr>
  <tr>
    <td>Февраль</td>
    <td>$50</td>
  </tr>
</table>
Попробуйте сами »

Примечание: Тег <caption> следует вставлять сразу после тега <table>.


HTML Упражнения

Добавьте заголовок таблицы с надписью "Имена".

<table>
  
  <tr>
    <th>Имя</th>
    <th>Фамилия</th>
    <th>Пункт</th>
  </tr>
  <tr>
    <td>Андрей</td>
    <td>Щипунов</td>
    <td>50</td>
  </tr>
</table>




×

Связаться с отделом продаж

Если вы хотите использовать услуги schoolsw3 как образовательное учреждение, команда или предприятие, отправьте нам электронное письмо:
sales@schoolsw3.com

Сообщить об ошибке

Если вы хотите сообщить об ошибке или внести предложение, отправьте нам электронное письмо:
help@schoolsw3.com

Schoolsw3 оптимизирован для обучения и подготовки. Примеры могут быть упрощены для улучшения чтения и обучения. Учебники, ссылки и примеры постоянно проверяются, чтобы избежать ошибок, но мы не можем гарантировать полную правильность всего контента.
При использовании Schoolsw3 вы соглашаетесь прочитать и принять наши условия использования,
политику использования файлов cookie и конфиденциальности.

Авторское право 1999- принадлежит Refsnes Data. Все права защищены. Schoolsw3 работает на SW3.CSS.