Выбрать элемент на основе дочернего класса

Есть ли способ в CSS выбрать элемент, который имеет подэлемент с заданным классом?

Я хочу применить стиль к списку <ul> с <li> с определенным классом.

Ответы

Ответ 1

Это невозможно с помощью css, так как вы работаете против каскада, выбирая предка на основе потомка.

Лучшее, что я могу предложить и предложить, - это подход jQuery:

$(document).ready(
  function() {
    $('.givenClassName').parent().addClass('something');
  }
);

Это находит элемент с givenClassName, а затем выбирает его родительский элемент и добавляет класс something к этому элементу.

@Blaenk предлагает альтернативный подход, который более универсален (его подход не требует, чтобы элемент предка был родителем элемента, который вы выбираете).

Очевидно, что другие JS-библиотеки и JS сами по себе могут достичь такого же эффекта, хотя я не могу предлагать конкретные советы, так как я все еще только знакомлюсь с JS и в основном с jQuery (почему да, я стыдно за себя...).

Ответ 2

Насколько я знаю, это, к сожалению, невозможно с CSS.

Если вы можете использовать Javascript, jQuery имеет хороший способ сделать это с помощью метода closest(). документация для него даже отображает пример, очень похожий на ваш: выбор ul, который имеет li определенного класса.

$("li.some-class").closest("ul");

Простите меня, если это не лучший способ сделать это в jQuery. Я на самом деле новичок в jQuery, и это один из методов, которые я изучил до сих пор, и это казалось подходящим.

Ответ 3

Нет. CSS Cascade не позволяет использовать этот селектор.

Лучшим решением в этом случае будет либо изменение DOM с помощью JavaScript, либо изменение итогового HTML для добавления классов в теги ul.

Ответ 4

ul li {
    /* styles */
}

Это то, о чем вы просите?