Удаление нежелательной ячейки таблицы граничит CSS
У меня есть специфическая и расстраивающая проблема. Для простой разметки:
<table>
<thead>
<tr><th>1</th><th>2</th><th>3</th></tr>
</thead>
<tbody>
<tr><td>a</td><td>b></td><td>c</td></tr>
<tr class='odd'><td>x</td><td>y</td><td>z</td></tr>
</tbody>
</table>
Я применяю различные значения цвета фона к thead, TR и TR нечетные элементы. Проблема состоит в том, что в большинстве браузеров, каждая ячейка имеет нежелательную границу, которая не является цветом ни одной из строк таблицы. Только в Firefox 3.5 делает таблицу, не имеют никаких границ ни в какой ячейке.
Я был бы, точно так же, как, чтобы знать, как удалить эти границы в других главных браузерах так, чтобы единственная вещь Вы видели в таблице, альтернативные цвета строк.
5 ответов
Вам нужно добавить это на ваши CSS:
table { border-collapse:collapse }
Измените свой HTML такой:
<table border="0" cellpadding="0" cellspacing="0">
<thead>
<tr><td>1</td><td>2</td><td>3</td></tr>
</thead>
<tbody>
<tr><td>a</td><td>b></td><td>c</td></tr>
<tr class='odd'><td>x</td><td>y</td><td>z</td></tr>
</tbody>
</table>
(добавил
<table border="0" cellpadding="0" cellspacing="0">
<thead>
<tr><td>1</td><td>2</td><td>3</td></tr>
</thead>
<tbody>
<tr><td>a</td><td>b></td><td>c</td></tr>
<tr class='odd'><td>x</td><td>y</td><td>z</td></tr>
</tbody>
</table>
(добавил Corning = «0» CellPadding = «0» CellPacing = «0» )
В CSS вы можете сделать следующее:
table {
border-collapse: collapse;
}
Установите атрибут атрибута таблицы на 0 .
Вы также можете использовать стиль CSS, Border-Sipping: 0 , но только если вам не нужно поддерживать более старые версии IE.
Попробуйте присвоение стиля границы: 0PX; Граница-коллапс: рухну; к элементу таблицы.