применить CSS к вложенным div - PullRequest
Новая
       2

применить CSS к вложенным div

0 голосов
/ 02 августа 2009

Я использую следующий код на своей странице: 

<div id="itemstable" class="item_type1">
...other divs here...
</div>

И в моем файле CSS у меня есть этот код: 

.item_type1 div {
    background-image: url(images/type1.giff);
}

проблема в том, что существует много разных типов элементов, поэтому мне нужно иметь много строк в моем файле CSS. Мне было интересно, как применить стиль background-image: url(images/type1.giff); к вложенным элементам div, не назначая его каждому. например. Я хочу изменить код для div "itemstable", чтобы он применял правило css к вложенным div.

Возможно ли это?

РЕДАКТИРОВАТЬ: Я ищу что-то вроде этого: 

<div id="itemstable" style="SET BACKGROUND IMG FOR NESTED DIVS HERE">
...other divs here...
</div>

Ответы [ 2 ]

1 голос
/ 03 августа 2009

Я думаю, что добавление немного вашего HTML-кода облегчит ваш вопрос.

В составной селектор можно включить несколько правил: 

.item_type1 div.a, .item_type1 div.b, .item_type1 div.c {
  background-image: url(xyz.gif);
}

Но поскольку вы извлекаете изображения из базы данных динамически, вам нужно будет либо включить их в свой динамический код - в сами div, либо динамически создавать CSS, как предложено выше: 

<style>
<% for $i in $images { echo "div.image$i div { background-image: url(/path/to/$i) }" %>
</style>
1 голос
/ 02 августа 2009

(Если я правильно понял вопрос:)

Подумайте об использовании другой схемы ID / класса. Я не знаю о дальнейших особенностях вашей структуры, но id="itemstable" class="item_type1" кажется мне немного излишним. Может ли itemstable быть чем-то еще, кроме item_type1? Попробуйте применить более общие имена классов и сохранить конкретные случаи для идентификаторов.

В противном случае вы можете добавить еще один класс, который отвечает за добавление фонового изображения: class="item_type1 item_types".

EDIT

Поскольку кажется, что основной проблемой является явная масса (не применение стиля, как предполагает заголовок), вероятно, лучше всего динамически вставить стиль в заголовок страницы. Что-то вроде: 

<head>
    ...
    <style type="text/css" media="screen">
        <?php echo "#$myelement"; ?> div { background: url(<?php echo $image; ?>) ...; }
    </style>
</head>

Встроенные стили могут применяться только к элементу напрямую, а не к его дочерним элементам. I.e.:

<div style="background: ...;">

Фон применяется только к этому одному div.
Вы не можете использовать селекторы во встроенных стилях, таких как: 

<div style="div { background: ...; }">
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...