Как создать один класс для всех элементов таблицы?

[RFbager]

Собственно встала проблема с css для таблички.Хотелось бы сделать стили для каждой ячейки в одном табличном классе,да бы не лепить 135 маленьких классов на каждую ячейку.Возможно ли это?Буду крайне благодарен за пример.

Edited April 4, 2012 by RFbager

[wildhind]

не совсем понятно, что именно вы имеете в виду, но может быть…

table td {
стили
}

???

[RFbager]

не совсем понятно, что именно вы имеете в виду, но может быть…

table td {
стили
}

???

проблема в том,что у каждой ячейки свои особенные параметры,то-есть задний фон,размеры и много чего еще (

[K313]

CSS:

.a {background:url("/img/img1.png");}
.b {background:url("/img/img2.png");}
....
.m {border-width:1px;}
.n {border-width:2px;}
....
.x {color:#f00;}
.y {color:#0f0;}
.z {color:#00f;}
}

HTML:

....
<td class="a m x">...</td>
<td class="a n x">...</td>
<td class="b n z">...</td>
....

[Switch74]

ну есди они уникальны, то и правила для них уникальны

[RFbager]

CSS:

.a {background:url("/img/img1.png");}
.b {background:url("/img/img2.png");}
....
.m {border-width:1px;}
.n {border-width:2px;}
....
.x {color:#f00;}
.y {color:#0f0;}
.z {color:#00f;}
}

HTML:

....
<td class="a m x">...</td>
<td class="a n x">...</td>
<td class="b n z">...</td>
....

Большое спасибо за иллюстрацию примера.Вот именно это и пугает.Возможно есть какие-то свойства для управления конкретной ячейкой таблицы?Например номер столбца и строки и дальше перечислять свойство?Или пример из цитаты единственное решение?

[alexandr_v-vich]

RFbager,

Возможно есть какие-то свойства для управления конкретной ячейкой таблицы?Например номер столбца и строки и дальше перечислять свойство?Или пример из цитаты единственное решение?

http://htmlbook.ru/samcss - разделы, где есть слово "селектор". Возможно, что-нибудь вам поможет.

[wildhind]

Возможно есть какие-то свойства для управления конкретной ячейкой таблицы?Например номер столбца и строки и дальше перечислять свойство?

table tr:nth-child(3) td:nth-child(8) {
стили для восьмой ячейки третьей строки
}

[SelenIT]

Можно еще посмотреть в сторону <col>/<colgroup>...

[wildhind]

но ведь для col/colgroup не любой стиль можно задать

[SelenIT]

Увы, это так. Но фон, общий для нескольких десятков ячеек, кроме пары-тройки исключений — без проблем, вроде бы.

[RFbager]

Возможно есть какие-то свойства для управления конкретной ячейкой таблицы?Например номер столбца и строки и дальше перечислять свойство?

table tr:nth-child(3) td:nth-child(8) {
стили для восьмой ячейки третьей строки
}

Огроменное спасибище,именно то что нужно

Спасибо всем,кто участвовал в решении вопроса.

Edited April 4, 2012 by RFbager

[wildhind]

только аккуратнее!

Этот способ не работает в устаревших версиях малопопулярных браузеров, но иногда их поддержка требуется по ТЗ.

[RFbager]

только аккуратнее!

Этот способ не работает в устаревших версиях малопопулярных браузеров, но иногда их поддержка требуется по ТЗ.

Перестали работать события в ячейке(.Я так понимаю эта конструкция жестко прописывает правила поведения дочернего элемента или где-то мой косяк?Кстати,а возможно мсобытия прописать непосредственно в css?

только аккуратнее!

Этот способ не работает в устаревших версиях малопопулярных браузеров, но иногда их поддержка требуется по ТЗ.

Перестали работать события в ячейке(.Я так понимаю эта конструкция жестко прописывает правила поведения дочернего элемента или где-то мой косяк?Кстати,а возможно мсобытия прописать непосредственно в css?

[wildhind]

Что за события? Ни на какие события это влиять не должно, здесь всего лишь визуальное оформление.

[RFbager]

только аккуратнее!

Этот способ не работает в устаревших версиях малопопулярных браузеров, но иногда их поддержка требуется по ТЗ.

Перестали работать события в ячейке(.Я так понимаю эта конструкция жестко прописывает правила поведения дочернего элемента или где-то мой косяк?Кстати,а возможно мсобытия прописать непосредственно в css?

[RFbager]

Что за события? Ни на какие события это влиять не должно, здесь всего лишь визуальное оформление.

Вот так все работает.

<td class="имя класса" align="center" ID="c2" onMouseOver="newColor('c2')" onMouseOut= "backColor('c2')" onClick="location='адрес'">

Если сделать выше описанной конструкцией,все так же очень хорошо смотрится,не приходится добавлять класс в каждую ячейку,но события onMouseOver="newColor('c2')" onMouseOut= "backColor('c2')" перестают работать(.То-есть не меняется задний фон скриптом.

[wildhind]

Итак, предстоит большая работа.

Первым делом вам следует слегка причесать и почистить от мусора вашу запись.

Вот из этого:

<td class="имя класса" align="center" ID="c2" onMouseOver="newColor('c2')" onMouseOut= "backColor('c2')" onClick="location='адрес'">

следует сделать это:

<td>

Затем вам нужно будет полностью объяснить свою задачу, чтобы не пришлось догадываться, что же вам на самом деле нужно.

[RFbager]

Итак, предстоит большая работа.

Первым делом вам следует слегка причесать и почистить от мусора вашу запись.

Вот из этого:

<td class="имя класса" align="center" ID="c2" onMouseOver="newColor('c2')" onMouseOut= "backColor('c2')" onClick="location='адрес'">

следует сделать это:

<td>

Затем вам нужно будет полностью объяснить свою задачу, чтобы не пришлось догадываться, что же вам на самом деле нужно.

Разве события можно как-то через css прописать?Здесь используется скрипт смены изображения в ячейке таблицы+ячейка таблицы выступает в виде ссылки,и для индексации в поисковиках оставил еще и обычную ссылку внутри ячейки таблицы.Вот так вот сделал кнопочку...

[alexandr_v-vich]

RFbager, http://htmlbook.ru/css/hover

а onClick уберите и оставьте просто ссылку.

Т.е. это вы кнопку так сделали?

[wildhind]

понятнее не стало.

хотя на самом деле просто страшно. Неужто я правильно понимаю?

Для кнопки есть тэг <button>.

Обработчик же навешивается в специально обученном файле js, но никак не в атрибутах html.

И всё-таки: какая задача перед вами стояла? Можете её описать, не применив ни единого технического термина? Представьте, что перед вами жгучая блондинка.

[RFbager]

RFbager, http://htmlbook.ru/css/hover

а onClick уберите и оставьте просто ссылку.

Т.е. это вы кнопку так сделали?

Да.Точнее верхнее меню.Сайт делаю не на cms.

[RFbager]

понятнее не стало.

хотя на самом деле просто страшно. Неужто я правильно понимаю?

Для кнопки есть тэг <button>.

Обработчик же навешивается в специально обученном файле js, но никак не в атрибутах html.

И всё-таки: какая задача перед вами стояла? Можете её описать, не применив ни единого технического термина? Представьте, что перед вами жгучая блондинка.

Создание верхнего меню.Без тегов div.

Edited April 5, 2012 by RFbager

[NeoXidizer]

чем вам div не угодил

[wildhind]

а и впрямь: зачем для меню <div>?

Ведь есть специально для этого предназначенный <nav>.

А зачем там скрипты вообще? Разве что какие модные визуальные эффекты делать, но это лучше делать уже имея чуть более крепкую подготовку.

[RFbager]

а и впрямь: зачем для меню <div>?

Ведь есть специально для этого предназначенный <nav>.

А зачем там скрипты вообще? Разве что какие модные визуальные эффекты делать, но это лучше делать уже имея чуть более крепкую подготовку.

Проблема в том,что я долгое время(около трех лет) занимался программированием(с++,delphi,чуточку ассемблер) и мне гораздо проще реализовывать идеи используя скриптовые языки,нежели вдаваться в тонкости html-разметки.

Скрипты именно ради модных визуальных эффектов.Div в данной задаче не подходит из-за своей "резиновой" структуры.Необходимо четкое позиционирование элементов при появлении полос прокрутки браузера,без малейших смещений.Поэтому выбор пал на табличную верстку.За тег <nav> спасибо,гляну что к чему.

Судя по документации,тег <nav> не работает в ie7

Edited April 6, 2012 by RFbager