Можно ли смоделировать интервал между ячейками таблицы так, чтобы интервалы по вертикали и горизонтали были разными? - PullRequest
Новая
       7

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

3 голосов
/ 31 октября 2008

В CSS вы можете указать интервал между ячейками таблицы, используя свойство border-spacing таблицы.

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

Если у меня сплошной фон, я могу имитировать интервалы, используя границы того же цвета, что и цвет фона.

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

Учитывая, что данные, которые я отображаю, являются табличными данными, есть ли разумный способ реализовать этот стиль с помощью таблиц?

Ответы [ 2 ]

10 голосов
/ 31 октября 2008

Вы можете указать различные расстояния для горизонтальных и вертикальных краев для border-spacing или связанных свойств. Просто укажите более одного измерения. например., 

border-spacing: 1px 2px;
6 голосов
/ 31 октября 2008

В общем случае , где вы можете указать значения, которые могут быть применены глобально или индивидуально к свойству (например, «отступ»), следуйте простому шаблону.

  • Если указать одно значение (например, обивка: 2px; ) значение применяется сверху, снизу, слева и справа объекта.

  • Если указать два значения (например, обивка: 2px 7px; ) первое значение применяется сверху и снизу и второй слева и справа.

  • Если указать три значения, первое значение применяется к вершине, второе значение слева и правильно, и окончательное значение для Дно.

  • Если указать четыре значения (например, обивка: 1px, 2px, 3px, 4px; ) значения применяются сверху, справа, внизу слева в этом порядке (запомните порядок, используя слово TRouBLe).

...