Каталог
Веб-разработка с нуля: четыре курса по порядку.
HTML, затем CSS, JavaScript и SQL. Каждый курс говорит, что нужно знать до него и что вы будете уметь после.
Загружаем курсы…
Каталог
HTML, затем CSS, JavaScript и SQL. Каждый курс говорит, что нужно знать до него и что вы будете уметь после.
Загружаем курсы…
Урок 34 из 70 · 12 мин
thead, tbody, tfoot, scope, colspan, rowspan, headers и colgroup: таблицы, понятные и людям, и читалкам.
Бухгалтер просит таблицу продаж за неделю: по дням, по товарам, и итог внизу.
Большие таблицы для меня — ад, если в них нет заголовков и групп. Сделай правильно, пожалуйста.
<thead><table border="1">
<thead><tr><th>День</th><th>Чашек</th></tr></thead>
</table><tbody><table border="1">
<tbody><tr><td>Пн</td><td>120</td></tr></tbody>
</table><tfoot><table border="1">
<tbody><tr><td>Пн</td><td>120</td></tr></tbody>
<tfoot><tr><td>Итого</td><td>120</td></tr></tfoot>
</table>scopescope="col" — заголовок столбца, scope="row" — строки.<tr><th scope="row">Понедельник</th><td>120</td></tr>colspan<table border="1">
<tr><td colspan="2">Итого</td></tr>
<tr><td>Январь</td><td>Февраль</td></tr>
</table>rowspan<table border="1">
<tr><td rowspan="2">Выходные</td><td>Сб</td></tr>
<tr><td>Вс</td></tr>
</table>headerstd: список id заголовков, к которым она относится.scope не хватает.<th id="mon">Пн</th><th id="steps">Шаги</th>
<td headers="mon steps">8 200</td><colgroup>caption.<table border="1">
<colgroup><col><col style="background:#fde68a"></colgroup>
<tr><td>Пн</td><td>120</td></tr>
</table><col>colgroup. span — сколько столбцов охватывает.<table border="1">
<colgroup><col span="2"><col style="background:#bbf7d0"></colgroup>
<tr><td>Январь</td><td>Февраль</td><td>Итого</td></tr>
</table>Разбей таблицу продаж на thead, tbody и tfoot, у заголовков столбцов поставь scope="col", а ячейку «Итого» растяни на два столбца (colspan="2").
thead со scope="col" — пока нетtbody — пока нетtfoot на два столбца — пока нетВыберите один ответ.
Как отметить, что ячейка <th> — заголовок строки, а не столбца?
Выберите один ответ.
Как сделать ячейку шириной в три столбца?
Выберите все подходящие варианты.
Какие элементы группируют строки таблицы?
Проверяем состояние обучения…