enlaces y mas enlaces...

Hola a todos,
estoy tratando de hacerme mi primera página despues de haber hecho la de prueba, que oye... no ha quedado nada mal....jejejeje
entonces me surje una duda....
La estoy haciendo muy parecida a la del curso, pero ya con mis contenidos y tal.... pero, en la plantilla.html quiero poner una imagen, la del buzon de correo, para que me puedan mandar correos desde ahí, pero como en la hoja de estilos hemos hecho un estilo para los enlaces, el cual les pone una franja gris cuando te situas sobre ellos, esta imagen me la pone en un parrafo aparte y me la pone gris cuando pasa el raton por encima...
mi pregunta es:
¿como se le puede decir que este enlace no use el "estilo" que le hemos dado en "estilo-general.css"?
es decir, como quiero que salga es: el parrafo que estoy escribiendo y ponerle la imagen del sobre, o incluso solo en una palabra el vinculo a la dirección de correo....
No se si me he explicado bien....
Muchas gracias por la ayuda!

Hola:

Hay varias formas, pero creo que la más simple es crear una clase llamada, por ejemplo, .sin-subrayar y aplicarla al enlace:

<a [B]class="sin-subrayar"[/B] href="mailto:correo@algunacosa"><img src="ruta_de_mi_imagen" title="Descripción de la misma" alt="Descripción si es que no se encuentra la imagen" /></a>

Y en la hoja de estilos creas una clase con el nombre que utilizaste:

.sin-subrayar {
  text-decoration: none;
}

Eso debería funcionar.

Si por algún motivo aún sigue apareciendo la línea debajo, entonces asegúrate de definir la clase .sin-subrayar {} después de darle estilos a los enlaces (los estilos se aplican en orden de aparición, así que tenlo en cuenta).

Gracias Skaparate!! no me funcionaba en un principio, pero dándole atributos a esta nueva clase he consguido quitar la barra dichosa...
Muchas gracias por la ayuda!!