Cómo anular la hoja de estilo global

Question

En pocas palabras, hay una hoja de estilo global:

a { font-family: Arial; }

Quiero usar una familia de fuentes diferente para un enlace en particular:

<a href="..." style="font-family: Helvetica;">...</a>

o

<span style="font-family: Helvetica;"><a href="...">...</a></span>

pero nada funciona. ¿Hay una manera fácil de hacer esto?

P.S. Estoy asignando dinámicamente (a través de PHP) diferentes fuentes a diferentes enlaces, por lo que crear una clase especial no es una opción.

Answer 1

A menos que tenga una fuente específica llamada Helvetica, debe tener en cuenta que en algunas plataformas (como Windows, a través de FontSubstitutes ), Helvetica tiene un alias de Arial. Esa podría ser la fuente del problema. Pruebe con otra fuente y vea.

Answer 2

Tu primer intento

  <a href="..." style="font-family: Helvetica;">...</a>

debería haber funcionado. Acepta que probablemente te falta una fuente. Los estilos en línea tienen prioridad sobre cualquier otro estilo al lado de una hoja de estilos definida por el usuario. Aquí está el orden de prioridades para las definiciones de estilo:

1. Estilo definido por el usuario
2. Hoja de estilo incorporada o en línea
3. Hoja de estilo interna
4. Hoja de estilo externa
5. Estilo predeterminado del navegador

Dentro de una hoja de estilo, las prioridades son las siguientes:

1. ¡Cualquier cosa marcada! importante

2. id

3. .class
4. elemento

Además, tiene la regla de mayor especificidad: div a anula a.

Aquí está un buen artículo con más detalles sobre el tema .

La sugerencia de @ Kip es tu mejor opción.

Answer 3

Lo que has escrito debería funcionar, a menos que el problema sea lo que Chris señaló,

Cuando obtienes un par de fuentes para las que esto funciona correctamente, podrías considerar que una mejor manera de hacerlo sería declarar una clase para los enlaces especiales que de alguna manera te recuerdan a por qué necesita una fuente separada (¿tal vez porque desea que se noten especialmente?)

a { font-family: Arial; }
a .noticed { font-family: Helvetica; }

Luego en HTML:

<a class="noticed" href="...">...</a>

Cambiar la fuente creando una etiqueta de extensión alrededor del enlace, o agregando estilo en línea al enlace, solo huele a los viejos tiempos de las etiquetas <font>.

Answer 4

Los estilos de elementos

anulan los estilos globales, por lo que Chris Jester-Young probablemente tenga razón y en realidad no tenga una fuente Helvetica; pruebe con una fuente diferente, p. Courier o Times New Roman que está seguro de que existe