Атрибуты cellpadding и cellspacing на CSS
Те, кто беспокоится о валидности своей вёрстки по HTML5, столкнулись с той проблемой, что в HTML5 убрали атрибуты cellpadding и cellspacing. Безусловно, имеется вариант указать cellpadding и cellspacing через CSS, о чём я сейчас и напишу.
Начнём с атрибута cellpadding, отвечающего за поля внутри ячеек. Думаю, что многие догадались, как им управлять. Давайте с Вами попробуем обнулить cellpadding через CSS:
td {
padding: 0;
}
Как видите, всё достаточно очевидно. А теперь перейдём к атрибуту cellspacing.
Этот атрибут отвечает за границы между ячейками. Здесь несколько сложнее и свойства зависят от того, что Вы хотите сделать: обнулить границы или поставить иные значения. Если обнулить, то это делается так:
table {
border-collapse: collapse;
}
Данный код обнулит cellspacing, как правило, это и требуется. А если же нужно не обнулить, а изменить значения, то можно использовать border-spacing:
table {
border-spacing: 1px 2px 4px 5px;
}
Это отступы ячеек друг от друга сверху, справа, снизу и слева. То есть числа идут по часовой стрелке, аналогично, как и в свойствах margin и padding.
Вот так легко можно задавать атрибуты cellpadding и cellspacing на CSS.
-
- Михаил Русаков
Комментарии (5):
Может, побольше статей по PHP делать?
Ответить
Их и так побольше. Да и большинство статей берутся на основе вопросов и просьб у учеников.
Ответить
Спасибо, меня всегда напрягала необходимость обнулять cellpadding и cellspacing в html. Теперь для всего body в css пропишу body table { border-collapse: collapse; border-spacing: 0; }
Ответить
Полезная информация! Только мне кажется, не совсем правильно говорить, обнулить границы border-collapse: collapse т.к. данное свойство не обнуляет, а создает одну общую рамку для двух соседних ячеек таблицы, а также одну общую рамку для ячейки и таблицы.
Ответить
название статьи "Атрибуты cellpadding и cellspacing на CSS", вопрос а где упомянается о cellpadding?
Ответить
Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.