2010-01-16 1 views
19

Eric meyer reset css предлагает «таблицы по-прежнему нужны» cellpacing = «0» «в разметке». Это необходимо? и в чем преимущество border-collapse: collapse; и border-spacing: 0;?Нужно ли добавлять cellpacing = "0" cellpadding = "0" в <table>?

, и это только предлагает использовать cellpacing, а таблица имеет другое свойство, называемое cellpadding?

/* tables still need 'cellspacing="0"' in the markup */ 
table { 
     border-collapse: collapse; 
     border-spacing: 0; 
} 

ответ

11

cellpadding не рекомендуется, так как свойство padding CSS достаточно переопределяет параметры по умолчанию для атрибута cellpadding таблицы. Как говорится в другом ответе, в старых браузерах нет совместимого свойства CSS для cellspacing, оставив атрибут HTML единственным способом полностью «сбросить» этот параметр на 0. border-spacing: 0; позаботится об этом для браузеров, которые его поддерживают.

Что касается border-collapse — по умолчанию ячейки таблицы имеют свои собственные границы, и collapse сольются границы между соседними ячейками вместе, давая появление (обычно одного пикселя) сетки, которая не достижима любая другая способ, когда cellspacing="0". До border-collapse обычно поддерживалась, поэтому вы увидите таблицы с cellspacing="1" и цвет фона на столе, а также белые фоны на ячейках таблицы.

border-collapse:collapse; находится в файле reset.css просто потому, что это самый общий желаемый результат. Если вы не хотите этого режима, вы бы прекрасно удалили это из reset.css.

6

Internet Explorer 6 и 7, и, возможно, другие ранние браузеры не распознают атрибут border-spacing и как таковой, он предлагает вам по-прежнему поставлять значения в HTML, а также.

Check out the compatibility table on SitePoint

1

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

Использование border-collapse: collapse; означает, что две ячейки с одинаковыми границами рядом друг с другом будут получать только один набор граничащих вместо двойного, например. правая граница одной ячейки рухнет с левой границей в следующей ячейке в строке.

Существует не CSS стиль для границы таблицы между ячейками до CSS 2, поэтому его необходимо отключить, используя атрибут HTML cellspacing="0" на столе для поддержки старых браузеров, таких как IE 7 *. Если между ячейками есть границы таблицы, то сглаживание границы, естественно, не будет работать, поскольку границы не будут рядом друг с другом.

* Я действительно наслаждался ощущением вызова IE 7 «старше браузера»;)

+0

а как насчет cellpadding? –

Смежные вопросы