q no tome en cuenta estilo heredado

[basickdagger]

bueno tengo una duda, tengo un menu el cual tengo un estilo q los va tomando en todos los enlaces... existe alguna propiedad para q dentro de todos los enlaces haya alguno al q le coloque otro estilo.. por ejemplo...

si tengo

Código [Seleccionar] Expandir


<ul id="lista">
<li><a href="">uno</a></li>
<li><a href="">dos</a></li>
<li><a href="">tres</a></li>
</ul>

y mi estilo

Código [Seleccionar] Expandir


#lista li a{
font-size: 18px ;
color:#99CCCC;
}


pero si quiero q el elemento li tres no herede el estilo como puedo hacerlo...existe alguna propiedad? muchas gracias desde ya...

[engel lex]

no puedes evitar la herencia, pero puedes crear una regla extra usando nth-child

algo como

#lista li:nth-child(3) a {

}

[basickdagger]

no puedes evitar la herencia, pero puedes crear una regla extra usando nth-child

algo como

#lista li:nth-child(3) a {

}

muchas gracias voy a probar...

[#!drvy]

@engelx pero con nth-child(3) lo que haces es precisamente afectar solo al 3^er elemento. No evitas que recoga el estilo de los demas.

@basickdagger, mira te la propiedad :not de css. Por ejemplo:

Código (css) [Seleccionar] Expandir

#lista li:not(:last-child) a{
font-size: 18px ;
color:#99CCCC;
}}

Con esto haces que afecte a todos menos el ultimo elemento de la lista. Y lo mismo, puedes utilizar nth-child para no afectar a un elemento especifico.

Código (css) [Seleccionar] Expandir

#lista li:not(:nth-child(3)) a{
font-size: 18px ;
color:#99CCCC;
}

PD: El :not no funciona en IE8 y anteriores.

Saludos

[engel lex]

drvy | BSM: no habia usado nunca el not siempre lo que hacia en esos casos era sobreescribir!

[#!drvy]

Yo lo aprendí cuando me fije que en jQuery puedes usar tanto $('.clase:not()') como $('.clase').not() xD

Saludos

[basickdagger]

@engelx pero con nth-child(3) lo que haces es precisamente afectar solo al 3^er elemento. No evitas que recoga el estilo de los demas.

@basickdagger, mira te la propiedad :not de css. Por ejemplo:

Código (css) [Seleccionar] Expandir

#lista li:not(:last-child) a{
font-size: 18px ;
color:#99CCCC;
}}

Con esto haces que afecte a todos menos el ultimo elemento de la lista. Y lo mismo, puedes utilizar nth-child para no afectar a un elemento especifico.

Código (css) [Seleccionar] Expandir

#lista li:not(:nth-child(3)) a{
font-size: 18px ;
color:#99CCCC;
}

PD: El :not no funciona en IE8 y anteriores.

Saludos

muchas gracias por sus respuestas, investigando un poco también me recomiendan el uso de !important... esto también resolvería el problema?(curiosidad) pq tengo entendido q !important toma el valor donde este colocado !important sin excepcion...

[#!drvy]

Hay que tener cuidado con !important. Utilízalo solo cuando quieres que una propiedad no pierda su valor (que no se pueda sustituir). Utilizarlo en todos lados te dará mas problemas que soluciones.

Código (css) [Seleccionar] Expandir

.lista {background:#000 !important;}
.lista {background:#FFF;}
/* Lista: background:#000; */

Saludos