Записки самоучки

Февраль 16, 2007

Определение стилей ячеек столбца в теге COL

Filed under: CSS,Глюки,HTML — 4matic @ 1:37 пп

Я для верстки таблицы использую тег COL. Раньше как-то не придавал значения проблеме, которую сейчас озвучу.

С помощью тега COL нельзя передать всем ячейкам столбца свойство class по наследству. Поведение в каждом из распространенных броузеров различается: где-то наследование заканчивается на уровне THEAD, где-то вообще полное игнорирование. В любом случае систематизировать и искать закономерности нет никакого желания. (Кому интересно: может глянуть http://www.w3.org/TR/CSS21/tables.html#q4)

Поиск по русскоязычному интернету ничего не дал (хм… мало кто пользуется тегом COL для верстки таблиц или CSS для таблиц рулит???). Поиск по англоязычным сайтам был более удачным.

Оказалось, что с помощью тега COL для ячеек столбца можно задать только некоторые атрибуты. предложенные решения:

  1. Задавать атрибуты для каждой ячейки. Это решение влоб. Работает 100%, НО, согласитесь, что не удобно работать с таким кодом, плюс лишний трафик на клиента.
  2. Устанавливать стил, используя родительские связи (селекторы сестринских или дочерних элементов). Т.е. что-то по типу TD, TD+TD, TD+TD+TD, TD+TD+TD+TD. Обратите внимание, что стили будут переопределяться : т.е. стиль второго столбца будет актуальным и для третьего (TD+TD+TD). Думаю, что можно поизварщаться с DOM и дочерним селектором >. В сети предлагается использовать псевдоэлемент first-child, но он работает не везде.
  3. Хаки-велосипеды с помощью JS.
  4. Комбинировать все знания, для достижения прозрачного и удобного индивидуального решения.

Ссылки по теме:

  1. http://css-discuss.incutio.com/?page=StylingColumns
  2. http://ln.hixie.ch/?start=1070385285&count=1

Добавить комментарий »

Комментариев нет.

RSS feed for comments on this post. TrackBack URI

Добавить комментарий

Заполните поля или щелкните по значку, чтобы оставить свой комментарий:

Логотип WordPress.com

Для комментария используется ваша учётная запись WordPress.com. Выход / Изменить )

Фотография Twitter

Для комментария используется ваша учётная запись Twitter. Выход / Изменить )

Фотография Facebook

Для комментария используется ваша учётная запись Facebook. Выход / Изменить )

Google+ photo

Для комментария используется ваша учётная запись Google+. Выход / Изменить )

Connecting to %s

Создайте бесплатный сайт или блог на WordPress.com.

%d такие блоггеры, как: