возможно ли к содержанию одного блока подключить один стиль, а к содержанию другого -- другой?

[Тёмыч]

предположим имееться такой код:

<!-- первый блок -->
<div>
  <div class="b_1>аааа</div>
  <div class="b_2">бббб</div>
</div>
<!-- второй блок -->
<div>
  <div class="b_1">вввв</div>
  <div class="b_2">гггг</div>
</div>

Надо сделать так, чтобы к содержимому 1 блока применялась такая css:

b_1 {
 background-color: #F0F0F0;
 }
b_2 {
 background-color: #CCCCCC;
 }

А к содержимому второго блока например такая css:

b_1 {
 background-color: #CCCCCC;
 }
b_2 {
 background-color: #F0F0F0;
 }

Это возможно?

[swetlana]

Конечно возможно.

Но осторожно!

Chrome 10 видимо дорос до уровня IE6, и даже слегка перерос.

В нём теперь эта фича не просто не работает, но работает с глюком.

[Тёмыч]

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

[psywalker]

Ну и чё?

table+table td, не?

[Gaspode]

Ну, прикрутите к таблицам классы/айдишники. Ну или прикрутите дополнительные классы к ячейкам.

[Быколай]

<!-- первый блок -->
<div class="a_1">
  <div class="b_1>аааа</div>
  <div class="b_2">бббб</div>
</div>
<!-- второй блок -->
<div class="a_2">
  <div class="b_1">вввв</div>
  <div class="b_2">гггг</div>
</div>

a_1 b_1 {
 background-color: #F0F0F0;
 }
a_1 b_2 {
 background-color: #CCCCCC;
 }
a_2 b_1 {
 background-color: #CCCCCC;
 }
a_2 b_2 {
 background-color: #F0F0F0;
 }

[Тёмыч]

Вот, сделал пример:

http://temich11.nxt.ru/primer.html

Там -- 3 поля для игры в крестики нолики, сделанные при помощи таблиц. Оформлены этим css:

http://temich11.nxt.ru/style1.css

Как не трудно догадаться, он меняет положение фона:

http://temich11.nxt.ru/image/xo.png

, тем самым определяя в какой ячейке крестик, а в какой нолик.

Так вот, надо, что бы часть в css после коментария была разной, для разных таблиц. Надо это сделать без соседних и дочерних селекторов.

[Тёмыч]

Ну может и с дочерними, но без соседних

[Быколай]

Ну может и с дочерними, но без соседних

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

[Тёмыч]

Ну по другому никак? Хорошо, в любом случае спасибо.

[Быколай]

я что-то не совсем понимаю специфику задачи. если надо

Надо сделать так, чтобы к содержимому 1 блока применялась такая css...

А к содержимому второго блока например такая css...

то это решается заданием классов этим самым блокам.

если в хотите именно доску под крестики-нолики замонстрить, то тут шире простор для фантазии. я бы реальный img вставлял, крестик/нолик.

[Тёмыч]

Суть в том, что не удобно писать такой код:

.pole1 > tr > .a2,.pole1 > tr > .a3,.pole1 > tr > .b1,.pole1 > tr > .b3,.pole1 > tr > .c1,.pole1 > tr > .c2,.pole1 > tr > .c3 {
  background-position: 0px -80px;
}

А ведь именно так придёться делать в случае с крестиками ноликами, если я хочу применить определенное оформление к ячейкам a2 a3 b1 b3 c1 с2 c3 таблицы pole1.

Вот я и подумал, нельзя ли сделать как то так:

<table style="/style1.css">...

А style1.css выглядит как-то так:

.a2, .a3, .b1, .b3, .c1, .c2, .c3 {
  background-position: 0px -80px;
}

И если в этой таблице попадеться элемент с классом a2 или a3 и т.д. то к нему будет применено свойство background-position: 0px -80px; , а если он попадёться не в этой таблице, то свойство не будет применено.

Как то так.

[Быколай]

а что же не даёт всё же указать нужным ячейкам нужный класс?

[Justnewone]

В случае крестиков-ноликов должны быть всего 3 класса =) И тогда уже не все так запутанно кажется.

[Тёмыч]

а что же не даёт всё же указать нужным ячейкам нужный класс?

Тоесть задать классы типа :pole1_a1 pole1_a2 и т.д.?

Я кажется нашёл. Вот на одном сайте сделанно так:

<table class="contAll" width="100%" cellspacing="5" cellpadding="0" border="0">

<tbody>

<tr>

<td>

<link rel="stylesheet" type="text/css" href="/js/highslide/highslide.css">

.......................

</td>

</tr>

</tbody>

</table>

Тоесть получаеться, что highslide.css применяеться только к данной таблице?

[Тёмыч]

А всё, я понял... Просто не доконца усвоил тему с дочерними и контекстными селекторами... Простите

[Быколай]

А всё, я понял... Просто не доконца усвоил тему с дочерними и контекстными селекторами... Простите

не стоит извинений, лучше поздно чем никогда