hijos - selector elemento css

Selector de una etiqueta seguida directamente de otra etiqueta

Question

Esto selecciona todas las etiquetas <B> directamente precedidas por las etiquetas <A> :

A+B {
    /* styling */
}

¿Cuál es el selector para todas las etiquetas <A> directamente seguidas por las etiquetas <B> ?

Aquí hay un código HTML de muestra que corresponde a mi pregunta:

<a>some text</a>
<b>some text</b>

Answer 1

¿Quiere decir estilo A dado que tiene un elemento B directamente dentro o seguido? Me gusta esto:

<A>
    <B>
    </B>
</A>

// OR

<A>
</A>
<B>
</B>

No se puede hacer tal cosa en CSS (todavía). Eric Meyer afirma que este tipo de selector se ha discutido varias veces en la lista de correo de CSS, y no es factible. Dave Hyatt, uno de los principales desarrolladores de WebKit, comenta con una buena explicación de por qué no se puede hacer.

Echa un vistazo: la publicación de blog de Shaun Inman y el comentario de Eric Meyer .
David Hyatt también pesa .

Answer 2

No puedes en css.

Editar: Para ser un poco más útil, si utiliza, por ejemplo, jQuery (una biblioteca de JavaScript), puede usar .prev() .

Answer 3

Podrías, pero el soporte sigue fallando. El nombre de ese es el selector de hermanos adyacentes

http://reference.sitepoint.com/css/adjacentsiblingselector

Answer 4

Solo puede hacer lo contrario: esto selecciona todas las etiquetas directamente precedidas por etiquetas.

Esto es lógicamente equivalente a su solicitud.

A menudo uso esto para diseñar una fila de muchas casillas con etiquetas

CSS:

label+input {
    margin-left: 4px;
}

DOM:

<input id="a" name="a" type="checkbox"/><label for="a">...</label>
<input id="b" name="b" type="checkbox"/><label for="b">...</label>
<input id="c" name="c" type="checkbox"/><label for="c">...</label>