¿Existe un selector principal de CSS?
¿Cómo selecciono el <li>elemento que es padre directo del elemento ancla?
Como ejemplo, mi CSS sería algo como esto:
li < a.active {
property: value;
}
Obviamente, hay formas de hacer esto con JavaScript, pero espero que exista algún tipo de solución nativa para CSS Nivel 2.
El menú que estoy tratando de diseñar está siendo generado por un CMS, por lo que no puedo mover el elemento activo al <li>elemento... (a menos que le ponga un tema al módulo de creación de menú, lo cual prefiero no hacer).
El borrador de trabajo de selectores de nivel 4 del W3C incluye una :has()pseudoclase que proporciona esta capacidad, entre otras:
li:has(> a.active) { /* styles to apply to the li tag */ }
Todos los principales navegadores admiten este selector. Consulte https://caniuse.com/css-has para comprobar si su navegador de destino o las versiones del navegador lo admiten.
Es posible que deba recurrir al uso de JavaScript si su navegador de destino no es totalmente compatible con esta función.
Puedes utilizar la :has()pseudoclase CSS .
Consulte la compatibilidad del navegador en Caniuse.com .
No creo que puedas seleccionar el padre solo en CSS.
Pero como parece que ya tienes una .activeclase, sería más fácil mover esa clase a li(en lugar de a). De esa manera podrás acceder tanto al licomo aa través de CSS únicamente.
Puedes usar este script :
*! > input[type=text] { background: #000; }
Esto seleccionará cualquier padre de una entrada de texto. Pero espera, todavía hay mucho más. Si lo desea, puede seleccionar un padre específico:
.input-wrap! > input[type=text] { background: #000; }
O selecciónelo cuando esté activo:
.input-wrap! > input[type=text]:focus { background: #000; }
Mira este HTML:
<div class="input-wrap">
<input type="text" class="Name"/>
<span class="help hide">Your name sir</span>
</div>
Puedes seleccionar eso span.helpcuando inputesté activo y mostrarlo:
.input-wrap! .help > input[type=text]:focus { display: block; }
Hay muchas más capacidades; simplemente consulte la documentación del complemento.
Por cierto, funciona en Internet Explorer.
