Foro de elhacker.net

Hola a todos,
Iré al grano:
Miren el código de abajo.
Quiero dar estilo a la listas número 1 sin que se alteren las número 2.

<UL>
        <LI>NUMERO 1
               <ul>
                       <li>NUMERO 2
                       </li>
               </ul>
        </LI>
 
        <LI>NUMERO 1
               <ul>
                       <li>NUMERO 2
                       </li>
               </ul>
        </LI>
</UL>
 

Además quiero alterarlas sin tener que colocar atributos a las etiquetas;
para eso usé este código css:

ul > li
{
color: red;
}
 

Se supone que en el código anterior estoy indicando que se altere a las etiquetas LI que sean hijas directas de UL; pero no funciona, cada vez que hago esto se pintan de rojo todas las listas... ¿Alguien tiene por favor una solución?

Hola

A ver si es correcta mi teoria.

Si te fijas todas tus LI son hijas directas de algún UL. Pon otras LI dentro de un UL y verás como la primera se pinta pero las otras no.

El único qu eno deberia alterarse es el LI segundo que contiene numero1.

De lo que se trata es de hacer que las listas NUMERO 1 se pinten de rojo y las NUMERO 2 (desplegables) ignoren dicha orden.  Sólo quiero saber si hay una forma correcta de hacerlo, sin trucos...

Has probado con esto?

ul>li
{
background-color:red;
}
ul>li>ul>li
{
background-color:white;
}

A mi si que me ha funcionado...

Un saludo!

porque no lo haces asi

ul li:first-child
{
   //aqui tu estilo 
}
 

Saludos

+1


ul li { background-color:red;}
ul li+li { background-color:white;}