Как сделать один <td> диапазон обоих столбцов в таблице с двумя столбцами?

Как создать таблицу, подобную приведенному выше примеру в HTML и CSS. Я пробовал следующее:

но это не сработает. Может ли кто-нибудь помочь?

Ответы

Ответ 1

Вы должны использовать colspan для своей второй строки. Вот так:

<table>
    <tr>
        <td style="width:50%">TEXT</td>
        <td style="width:50%">TEXT</td>
    </tr>
    <tr>
        <td colspan="2" style="width:100%">TEXT</td>
    </tr>
    ...
</table>

Для изучения → HTML Colspan

Ответ 2

<td> имеют атрибут colspan, который определяет, сколько столбцов оно должно охватывать. Например, у вас есть 2 столбца, поэтому ваш очищенный код будет выглядеть так:

<table>
    <tr>
        <td width="50%"></td>
        <td width="50%"></td>
    </tr>
    <tr>
        <td width="50%"></td>
        <td width="50%"></td>
    </tr>
    <tr>
        <!-- The important part is here -->
        <td colspan="2">This will have 100% width by default</td>
    </tr>
    <tr>
        <td width="50%"></td>
        <td width="50%"></td>
    </tr>
    <tr>
        <td width="50%"></td>
        <td width="50%"></td>
    </tr>
</table>