выбрать все элементы типа X, но не один и тот же тип внутри них

Question

Например,

, если есть несколько DIV элементов, один внутри другого. скажем, 3 уровня.
как бы вы выбрали только 2-й уровень Div, не зная, насколько они глубоки,
и не в состоянии дать больше уроков?

// html example of a possible DOM
<div class="level1'>
    <a>
        <div>
            <a>
                <div></div>
            </a>
        </div>
    </a>
    <a>
        <div></div>
    </a>
</div>

обзор селекторов:
div.level1 > div => (BAD) ничего не вернет, потому что Div находится внутри a

div.level1 > a > div => (ПЛОХО) div второго уровня могут быть глубже, и точный xpath не должен быть записан

существует ли какая-то комбинация селекторов CSS, которая выдаст 'найти элементы, но никогда не найдет их внутри' , поэтому div.level1 div вернет только Div 2-го уровня, но не те, которые может быть внутри них (что-то в этом роде). Я считаю, что это очень мощная вещь.

Answer 1

Ваш первый селектор выглядит абсолютно нормально.Просто посмотрите на этот пример CSS:

<style type="text/css">
    a, div {
        display: block;
        margin: 10px;
        border: 1px solid grey;
        background-color: red
    }
    div.level1 > div {
        background-color: green;
    }
</style>

Только DIV второго уровня сопоставляется, так как он является прямым потомком div.level1.

Кстати: ваш HTML вообще не имеет смысла,DIVs внутри встроенных элементов плохие.Но ссылки внутри ссылок еще хуже:)

Answer 2

Маловероятно.
Но вы можете установить желаемое свойство на уровне> = 2 (div.level1 div) и отменить его на всех делениях ниже уровня 2 (div.level1 div div).

Конечно, всегда есть возможность использовать разные классы для каждого уровня.