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

Question

[Serezhka]

Здравствуйте.
Вот, например, есть код
<ul> <li><span id="span1">text</li> <li><span id="span2">text</li> <li><span id="span3">text</li> </ul>

Я могу отдельно выбрать каждый span. Могу-ли я как-то выбрать в css родительский ?
Или через jquery?
Большое спасибо.

Comments

[Serezhka]

Торопился, в коде ошибся, span не закрыл. Но суть не в этом :-)

Answer 1

[wscms]

Если на jQuery, то $('#span2').parent() это элемент списка
$('#span2').parent().css('Element') — доступ к css-ке li

Или что-то другое имеется ввиду?

Answer 2

[Serezhka]

Спасибо, ребята, за помощь.
Действительно нужно было именно зная дочерний, добраться до родительского, потому что к дочерним проставляются id, а к родителям нет. И к некоторым родителям нужно добавлять уникальные классы.
Хотелось бы именно через CSS, потому что через jquery я бы также всем родителям проставил id.
Но большое спасибо за помощь!
Вы мне очень помогли.
С уважением.

Answer 3

[karenishe]

Вот интересная статейка в тему: web-standards.ru/articles/parent-selector/

Answer 4

[pxx]

И, кстати, у вас не закрыты теги span, что есть очень не хорошо.

Answer 5

[SerDIDG]

Конечно, лучше всего навесить класс на контейнер, это будет самое верное решение.

Comments

[SerDIDG]

И от него добираться до нужно дочернего элемента.

Answer 6

[Антон]

1 костыль:
ul:has(span)
2 костыль:
:focus-within
https://webref.ru/css/focus-within

Answer 7

[Armanio]

$(elem).parent()

Answer 8

[freeek]

Ну, если любой span в li, то просто:

li span { 

}

Comments

[Doktor_Gradus]

Не, по вопросу он хочет наоборот, что-то вроде:

.span li:parent {
    //declaration block
}

[Doktor_Gradus]

span без точки, конечно же.

[freeek]

Вопрос просто не совсем ясно поставлен :)

Ещё есть .find() и .closest().

[Doktor_Gradus]

Это из jQuery, на нём задача реализуется элементарно. Но она не реализуема (по крайней мере, пока) на CSS.

[freeek]

Всё зависит от целей. Можно же просто задать данным li один стиль :)

Answer 9

[karenishe]

как я понял, пока есть только экспериментальные фишки такого плана. через js очевидно достаточно делается. через jQuery вообще элементарно