Как установить разный размер пробелов между столбцами HTML-таблицы

Question

Как установить разный размер пробелов между столбцами HTML-таблицы

0

Как я могу сделать следующее с помощью HTML и/или CSS: я хочу создать HTML-таблицу, скажем, с тремя столбцами, а gab между столбцами1 и столбцом2 больше, чем gab между столбцами2 и столбцом3. Ниже пример:

 +----------+ +----------+    +----------+
 | column1  | | column2  |    | colum3   |
 +----------+ +----------+    +----------+
 |  ...     | |  ...     |    |  ...     |
 +----------+ +----------+    +----------+
 | column1  | | column1  |    | colum3   |
 +----------+ +----------+    +----------+

Hansi Zimmrer 05 март 2014, в 15:50

Источник

Теги:

html

html-table

table

2 ответа

1

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

jforjs 05 март 2014, в 12:55

Ещё вопросы

Samuel Cook · Accepted Answer · 2014-03-05T12-06-00.000Z

Я бы просто использовал прописку на разных столбцах. В моем примере я использую имена классов, чтобы описать количество дополнений, которые я хочу иметь из предыдущего столбца.

<style type="text/css">
    td.col2{padding-left:10px;}
    td.col3{padding-left:50px;}
</style>

<table>
    <tr>
        <td class="col1">column1</td>
        <td class="col2">column2</td>
        <td class="col3">column3</td>
    </tr>
    <tr>
        <td class="col1">...</td>
        <td class="col2">...</td>
        <td class="col3">...</td>
    </tr>
    <tr>
        <td class="col1">column1</td>
        <td class="col2">column2</td>
        <td class="col3">column3</td>
    </tr>
</table>

Я уже боялся, что нет способа установить пространство для каждого столбца отдельно. Однако, спасибо за хороший, понятный пример кода, который показывает, как обойти проблему!