¿Hay alguna manera en CSS de seleccionar un elemento que tenga un subelemento con una clase dada?Elemento de selección basado en la clase secundaria
Quiero aplicar un estilo a una lista <ul> que tiene <li> con una clase particular.
Esto no es posible con css, ya que está trabajando contra la cascada seleccionando un antecesor basado en un descendiente.
Lo mejor que puedo ofrecer y sugerir es un enfoque jQuery:
$(document).ready(
function() {
$('.givenClassName').parent().addClass('something');
}
);
Esto encuentra el elemento con el givenClassName y luego selecciona su elemento padre y agrega la clase something a ese elemento.
@Blaenk sugiere un enfoque alternativo, que es más versátil (su enfoque no requiere que el elemento ancestro sea el elemento primario del elemento que está seleccionando).
Obviamente, otras bibliotecas JS, y JS por sí mismas, pueden lograr el mismo efecto, aunque no puedo ofrecer un consejo particular, ya que solo estoy familiarizándome con JS y sobre todo con jQuery (por qué sí, yo am avergonzado de mí mismo ...).
+1, y tiene un presupuesto sin cerrar en su ejemplo de código. –
@Jeff Rupert, gracias por el +1 y corrección (corregido para corregir) =) –
Jaja, estoy en el mismo barco que usted con respecto a Javascript y jQuery. He estado leyendo algunos libros para ponerme al día. Javascript: The Good Parts y jQuery en acción, Segunda edición –
ul li {
/* styles */
}
¿Es esto lo que estás pidiendo?
no. Necesito establecer el estilo para ul – akonsu
No. CSS Cascade no permite este tipo de selector.
La mejor solución en este caso sería modificar el DOM con JavaScript o cambiar el HTML resultante para agregar clases a las etiquetas ul.
Por lo que sé, lamentablemente esto no es posible con CSS.
Si puede usar Javascript, jQuery tiene una buena forma de hacerlo utilizando el método closest(). El documentation incluso enumera un ejemplo muy similar al suyo: seleccionando un ul que tenga un li de una clase en particular.
$("li.some-class").closest("ul");
Perdóname si esta no es la mejor manera de hacerlo en jQuery. En realidad, soy nuevo en jQuery y este es uno de los métodos que he aprendido hasta ahora, y me pareció apropiado.
+1 para un enfoque jQuery más versátil (que el mío). –
posible duplicado de [CSS parent selector] (http://stackoverflow.com/questions/1014861/css-parent-selector) –
sí, es un duplicado de hecho. gracias – akonsu