Cellpadding и cellspacing в CSS

Cellpadding и cellspacing в CSS

2016-04-2532671

Постоянное использование cellpadding и cellspacing в table – прошлый век. О том, как убрать cellpadding и cellspacing в CSS.

Можно убирать промежутки между ячейками с помощью короткого CSS кода. Здесь мы будем использовать такой атрибут, как border-collapse. У этого атрибута есть три варианта значений, мы же выбираем значение collapse. Соответственно, это будет означать cellspacing="0". C cellpadding все проще, достаточно для td прописать значение padding – 0. Для кого-то все это пустые слова, сам код вы можете видеть ниже.

Код CSS


Code
table {
border: 0px; /* border="0" */
border-collapse: collapse; /* cellspacing="0" */
}

table td {
padding: 0px; /* cellpadding="0" */
}

Код HTML


Code
<table>
<tr>
<td>Первая ячейка</td>
<td>Вторая ячейка</td>
</tr>
</table>

HTML код, как вы видите, прост, и не нужно использовать длинные атрибуты, ведь наши cellpadding и cellspacing в CSS.

Используйте классы (class) для таблиц, если нужно установить другой стиль для таблицы. Рекомендуется для других вариантов стиле прописывать !important. Дополняя этим кодом CSS, вы указываете приоритет стилю.

Код CSS


Code
table.new {
border-collapse: separate;
}

table.new td{
padding: 3px 6px;
border: 1px solid #dedede;
}

Код HTML


Code
<table class="new">
<tr>
<td>Первая ячейка</td>
<td>Вторая ячейка</td>
</tr>
</table>


Антон Рагулько 2012-09-10 в 10:10Спам
Мне кажется постоянное использование TABLE – прошлый век.
0
Чтобы оставить комментарий или отзыв под этой публикацией, войдите.