Фоновый рисунок для Div

[cmndr_alexgreen]

Подскажите как лучше реализовать:

Есть много Div'ов в виде кубиков. Стиль у них один, но фоновый рисунок должен быть разный,а в нутри каждого еще должен находиться разный контент. Не очень хочется создавать внутри них еще блоки только для задания фона, и не хочется делить стили для каждого квадрата свой лишь ради фона.

Как можно выйти из положения?

[cmndr_alexgreen]

вот коды кубиков:

html

   	<div id="acube_3">
	   <div id="bcube_1">text</div>
	   <div id="bcube_1"><div id="bcube_name"></div></div>
	   <div id="bcube_1"><img src="img/140-2.png" class="" alt=""></div>
	   <div id="bcube_1"><img src="img/140-4.png" class="" alt=""></div>
	   <div id="bcube_1"><img src="" class="" alt=""></div>
	   <div id="bcube_1"><img src="img/140-3.png" class="" alt=""></div>
	   <div id="bcube_1"><img src="img/140-1.png" class="" alt=""></div>
	</div>

css

#bcube_1 {display:inline-block;width:150px;height:150px;float:left;}

Соответственно в шаблоне для наглядности в кубиках сидят картинки, а когда начинаешь в кубики вставлять контент то от картинок нужно избавляться или переводить их в фон.

Edited November 21, 2012 by cmndr_alexgreen

[mrnobody]

Э-э-э, а чего у вас id одинаковые?! Исправьте на класс или напишите разные значения атрибута id.

А вот помочь не не знаю как (.

Edited November 21, 2012 by mrnobody

[cmndr_alexgreen]

Э-э-э, а чего у вас id одинаковые?! Исправьте на класс или напишите разные значения атрибута id.

ID одинаковые, потому что общие свойства блоков одинаковые, а фоновое изображение и контент, планируются разные.

ID или class, это пока не сильно важно, поскольку это всего навсего шаблон.

Да, самый простой вариант это сделать для каждого блока свой стиль, но отличаться они будут по сути только фоном. Это значительно добавит текста в файле css, к тому же не во всех блоках планируется рисунок.

[npofopr]

ID на то и ID, он должен быть 1.

class'ов может быть много одинаковых. И это важно, а то вы сейчас привыкните и будете потом везде использовать.

А выйти из ситуации можно так

[cmndr_alexgreen]

npofopr, да ID он на то и ID, но как бы это не было непрофессионально(, я во всех шаблонах все в подряд обзываю IDшниками, а уже перед вводом в работу делю. Криво со стороны, но честно говоря просто привык уже так (бюкв меньше).

Ваш пример вижу первый раз)), спасибо. Изучу, но пока наверно предпочту традиционные методы - в конце концов)) каждому блоку допишу style="background-image:url(смой имедж);" ).

Edited November 21, 2012 by cmndr_alexgreen

[DownHouse]

Я обычно с двойным классом делаю

    <div class="block block-1">text</div>
    <div class="block block-2">text</div>
    <div class="block block-3">text</div>

.block{тут общие свойства}
.block-1{background-image:url('pic1');}
.block-2{background-image:url('pic2');}
.block-3{background-image:url('pic3');}

[Vadimka]

поддерживаю, двойные классы это самый лучший вариант

[npofopr]

ну и можно давать классы автоматом через какой нибудь js

[cmndr_alexgreen]

Если честно даже и не знал что классы могут быть двойными)), как говорят век живи, век учись. Спасибо DownHouse за подсказку, я думаю это самый рациональный вариант.

[psywalker]

Если честно даже и не знал что классы могут быть двойными))

Я возможно тебя сейчас шокирую, но классы могут быть даже десятерными

[cmndr_alexgreen]

Если честно даже и не знал что классы могут быть двойными))

Я возможно тебя сейчас шокирую, но классы могут быть даже десятерными

Ты прав)))), это меняет мировоззрение)).