html - pagina - La familia de fuentes Wingdings no parece funcionar en Firefox y Opera
inspeccionar pagina web (6)
Mozilla y Opera son de compilación estándar. Wingdings no es estándar (qué sorpresa viene de Microsoft) porque no está asignado a Unicode, por lo que nunca debería usarse en un sitio web.
Sin embargo, no se desespere, la mayoría de los símbolos están disponibles en Unicode: consulte http://www.alanwood.net/demos/wingdings.html
Adenda importante (octubre de 2014): a partir de Unicode v7 , lanzado el 16 de junio de 2014, todos los caracteres de Webdings y Wingdings se han agregado a Unicode. Vea el comentario a continuación.
Estaba usando la fuente Wingdings en CSS para algunos símbolos como un lápiz y un ícono de inicio.
Funcionó en IE, Chrome y Safari, pero no en Firefox y Opera. Busqué en Google pero no encontré ninguna solución mejor.
¿Por qué no funciona en Firefox? Necesito usar esos iconos, ¿hay alguna forma de usar Wingdings en Firefox?
Para citar un sitio web:
Hubo un debate interminable entre las personas que dijeron que Mozilla debería admitir la fuente del símbolo en su configuración predeterminada porque es una habilidad valiosa y los abogados de estándares que dijeron que no, porque creen que el soporte viola el estándar HTML. Hasta ahora, los obstruccionistas han prevalecido.
Puede usar Gimp u otro software gráfico y hacer algunos GIF de los iconos necesarios de la fuente Wingdings.
Se puede acceder a los caracteres Wingdings de una manera compatible con Unicode, a través del "Área de uso privado" (puntos de código U+E000
a U+F7FF
). Estos códigos de caracteres están reservados para cualquier símbolo específico de la fuente que no forme parte del conjunto de caracteres Unicode normal, y de hecho Wingdingds mapea todos sus símbolos en el subrango U+F021
a U+F0FF
.
Por ejemplo, se puede acceder al indicador triangular, que está mapeado a P
= 0x50
en la codificación heredada, a través de U+F050
=
= 
(HTML) = /F050
(CSS).
No estoy seguro acerca de otros navegadores, pero funciona en Firefox 12.
@font-face {
font-family: "Your typeface";
src: url("type/filename.eot");
src: local("☺"),
url("type/filename.woff") format("woff"),
url("type/filename.otf") format("opentype"),
url("type/filename.svg#filename") format("svg");
}
más aquí http://nicewebtype.com/notes/2009/10/30/how-to-use-css-font-face/
solución simple en tu HTML
<style type="text/css">
@font-face {
font-family: "Ace Crikey";
src: url(ace.ttf);
}
.ace {
font-family: "Ace Crikey";
font-size: 230%;
}
</style>