Можно ли смоделировать интервал между ячейками таблицы, чтобы вертикальный и горизонтальный интервалы были разными?
В CSS вы можете указать интервал между ячейками таблицы, используя свойство таблицы border-spacing.
Однако это приводит к равномерному интервалу между столбцами и строками, и я нахожу больше ситуаций, когда используемые мной конструкции требуют промежутков между строками, но не столбцами, или наоборот.
Если у меня сплошной фон, я могу имитировать интервал, используя границы того же цвета, что и цвет фона.
Я также мог бы сделать div (например) первым дочерним элементом каждой ячейки таблицы и использовать либо отступы, либо поля для получения желаемых результатов, но это много дополнительной разметки, просто чтобы приспособить стиль.
Учитывая, что данные, которые я показываю, являются табличными, есть ли разумный способ добиться этого стиля с помощью таблиц?
Ответы 2
Вы может задаете разные интервалы для горизонтальных и вертикальных краев для border-spacing или связанных свойств. Просто укажите более одного измерения. например.,
border-spacing: 1px 2px;
Спасибо! Да, интервал между границами действительно особенный. Большинство других свойств, похожих на поля / границы, позволяют указывать четыре значения, а не только два, но, очевидно, это другое.
Я бы не стал беспокоиться о том, чтобы чувствовать себя глупо: даже если вы считаете, что должны были знать этот вопрос, кто-то с меньшим опытом, возможно, не догадывался, и теперь он это сделает.
В общий случай, где вы можете указать значения, которые могут применяться глобально или индивидуально к свойству (например, «заполнение»), следуйте простому шаблону.
Если вы укажете одно значение (например, отступ: 2 пикселя; ) значение применяется вверх, вниз, влево и вправо объекта.
Если вы укажете два значения (например, отступ: 2px 7px; ) первое значение наносится сверху и снизу и второй слева и справа.
Если вы укажете три значения, первое значение применяется к верху, второе значение слева и право, и окончательное значение низ.
Если вы укажете четыре значения (например, отступы: 1px, 2px, 3px, 4px; ) значения применяются сверху, справа, внизу, слева в указанном порядке (запомните порядок, используя слово TRouBLe).
Я чувствую, что выставил себя дураком. Похоже, что вы можете указать только две длины, а не четыре.