2010-07-15 18 views
5

tengo un a:hover para todos mis enlaces en mi página:¿Suprimir css para un div específico?

a:hover { 
    background-color: blue; 
    text-decoration: underline; 
    color: black; 
} 

pero pero hay otros específicos en un div que no quiero que le pase nada cuando se pasa sobre ellos, por lo que puedo hacer algo ¿Me gusta esto?

#what_we_offer a:hover { 
    background-color: none: 
    text-decoration: none; 
    color: none; 
} 

básicamente no quiero que haga ninguna de las anteriores cuando se cierne sobre ellos enlaces específicos.

gracias

Respuesta

6
#what_we_offer a:hover { 
    background-color: transparent; 
    text-decoration: none; 
    color: none; 
} 

utilizar transparente en lugar de ninguno, eso funciona.

gracias por todas las respuestas.

9

Sí que debería funcionar bien, aunque es probable que no desea establecer none a menos que realmente no quiere cualquier estilo ... el establecimiento de sus colores base, etc. debería funcionar bien.

#what_we_offer a:hover { 
    background-color:#fff;/*presuming was originally white*/ 
    text-decoration:none; 
    color:#000;/*presuming was originally black*/ 
} 

PS No estoy seguro de si era sólo un error tipográfico, pero su línea original background-color:none: se terminó con dos puntos frente a un punto y coma problemas por lo que habría causado.

+0

que no funcionó para mí, la dosis 'ninguna' atribuida no funciona. –

+0

Primero está su "anulación" para el "#what_we_offer" después del valor predeterminado: ¿desplazarse o antes? En segundo lugar, si usas mi código anterior, ¿qué obtienes? – scunliffe

3

En lugar de utilizar id con el uso de CSS Clase

/* for link where you want to change color on hover */ 
    .Link a:hover { 
     background-color: none: 
     text-decoration: none; 
     color: red; 
    } 

/* for link where you dont want to change color on hover */ 
    a:hover { 
     background-color: none: 
     text-decoration: none; 
     color: none; 
    } 
+1

en cuanto a 'id' contra' clase' - todo depende si @Mo tiene 1 div especial o una colección de divs especiales. – scunliffe

+0

el 'ninguno' atribuido a la dosis de color de fondo no funciona –

+0

sí, es un div especial y es por eso que usé ID. –

0

Sí, pero ten en cuenta que a: hover {} debe venir antes #what_we_offer a: hover {}.

+2

Dado que tienen diferentes especificidades, el orden realmente no importa. – Quentin

+0

@David Dorward: gracias por anotarse sobre esto. – ttchong

-4
a:hover { 
    background-color: none: 
    text-decoration: none; 
    color: none; 
} 

Esto es correcto.

Si sólo desea página en particular, añadir

body-id a:hover { 
    background-color: none: 
    text-decoration: none; 
    color: none; 
} 
+0

No es correcto (ninguno no es un color), desea usar un selector de id, no un selector de tipo, la pregunta dice * div * not * page * y no ha formateado su código. – Quentin

+0

Tu respuesta no es correcta. Si tiene un color de fondo predeterminado, decoración de texto, etc. para ese div, entonces se desvanecerá cuando el mouse se mueva sobre ese div. Todas estas propiedades deben establecerse en las propiedades predeterminadas para ese div en el bloque "a: hover". –

0

Creo que si lo hace lo contrario de lo que dijo Pranav, puede tener menos modificaciones i, e

 


/* for link where you ***DO*** NOT want to change color on hover */ 
    .Link a:hover { 
     background-color: none: 
     text-decoration: none; 
     color: red; 
    } 

/* for link where you want to change color on hover */ 
    a:hover { 
     background-color: none: 
     text-decoration: none; 
     color: none; 
    } 

por lo que necesita agregar clase para un href en algunos DIVs particulares

-1

Puede hacer uso de selectores de CSS. Lo mejor que creo que puede hacer es usar el selector not. Déjame mostrarte un ejemplo:

<html> 
     <head> 
       <style type="text/css"> 
         a:not([not_custom]){ 
           background: #00FF00; 
           color: #FF0000; 
         }      
       </style> 
     </head> 
     <body> 
       <div> 
         <a href="">Test 1</a> 
         <a href="" not_custom="">Test 2</a> 
         <a href="">Test 3</a> 
         <a href="" not_custom="">Test 4</a> 
         <a href="">Test 5</a> 
         <a href="" not_custom="">Test 6</a> 
       </div> 
     </body> 
</html> 

Como se puede ver, estoy definiendo el estilo a con el selector not. Entonces, digo que quiero poner un fondo verde y un color rojo en todos los a que no tienen el atributo not_custom. Como resultado de esto, puede ver que la Prueba 1, la Prueba 3 y la Prueba 5 tendrán el style definido y la Prueba 2, la Prueba 4 y la Prueba 6 serán normales, sin el estilo.

NOTA: puede definir el atributo que desea. No tiene que nombrar not_custom. Se puede llamar whatever si lo desea.

+0

No componga atributos cuando está escribiendo HTML (a menos que esté escribiendo HTML5 (aunque todavía es un borrador) y se ajusta a sus limitaciones sobre qué atributos personalizados se pueden nombrar (que no se llaman). ': not' aún no es lo suficientemente compatible como para un uso serio (especialmente si termina con un texto ilegible si falla, lo que podría ser el caso en esta situación) – Quentin

1

Cuando desee sobrescribir los valores de CSS, puede hacer dos cosas: agregar nuevas declaraciones de CSS después de la que desea sobrescribir o utilizar "! Important" ..Así para su problema que puede probar:

a.reset:hover { 
background-color: #FFFFFF; 
text-decoration: none; 
color: #000000; 
} 

.. y luego añadir los enlaces que desea anular esta nueva clase:

<a href="#" class="reset">Link with reset</a> 

Pero esta clase CSS debe ser declarada después de lo normal ", una "declaraciones de etiquetas o esto no funcionará.

Otra forma es utilizar! Importante, pero yo recomiendo no abusar de este. Pero para anular es el más rápido y más seguro para estar seguro de que funcionará:

a.reset:hover { 
background-color: #FFFFFF !important; 
text-decoration: none !important; 
color: #000000 !important; 
} 

.. y éste se puede añadir en cualquier parte de su archivo CSS y cualquier vínculo con el "Reset" clase será conseguir esos estilos: fondo blanco, sin decoración de texto y texto negro.

Ah, y para el fondo puede intentar: fondo: ninguno; y borrará todos los estilos de fondo ... background-color, background-image, etc.

Como nota al margen ... id se utilizan para hacer referencia a un solo elemento y debe ser único ... y las clases se utilizan para hacer referencia a múltiples elementos . Múltiples usos de la misma ID que usaría una clase css ... puede frenar Javascript y no validará su HTML.