Семейство шрифтов Wingdings, похоже, не работает в Firefox и Opera

Я использовал шрифт Wingdings в CSS для некоторых символов, таких как карандаш и значок дома.

Он работал на IE, Chrome и Safari, но не в Firefox и Opera. Я погуглил, но не нашел лучшего решения.

Почему он не работает в Firefox? Мне нужно использовать эти значки, есть ли способ использовать Wingdings в Firefox?

6 ответов


Mozilla и опера стандарт-compiliant. Wingdings не является стандартным (какой сюрприз от Microsoft), потому что не сопоставляется с Unicode, и поэтому никогда не должен использоваться на веб-сайте.

однако не отчаивайтесь, большинство символов доступно в Unicode: check http://www.alanwood.net/demos/wingdings.html

важное добавление (октябрь 2014): по состоянию на Unicode v7, освобожден 16 июня 2014 года, все персонажи из Webdings и Wingdings были добавлены в Unicode. См. комментарий ниже.


вы можете использовать символы юникода, такие как

http://www.fileformat.info/info/unicode/char/270e/index.htm


символы Wingdings can доступ к Unicode-совместимым образом, через " частную область использования "(codepoints U+E000 до U+F7FF). Эти коды символов зарезервированы для любых символов шрифта, не являющихся частью обычного набора символов Юникода, и действительно Wingdingds отображает все свои символы в поддиапазон U+F021 to U+F0FF.

например, треугольный флаг, который отображается на P = 0x50 в кодировке наследия, можно достигнуть через U+F050 = =  (HTML)=\F050 (CSS).

Я не уверен в других браузерах, но он работает в Firefox 12.


цитирую сайт:

были бесконечные дебаты между людьми, которые сказали, что Mozilla должна поддерживать шрифт символа в своей конфигурации по умолчанию, потому что это ценная способность и стандарты юристов, которые сказали нет, потому что они считают, что поддержка нарушает стандарт HTML. До сих пор преобладали обструкционисты.

http://hutchinson.belmont.ma.us/tth/Wfonts.html


@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");
  }

подробнее здесь http://nicewebtype.com/notes/2009/10/30/how-to-use-css-font-face/

простое решение в вашем HTML

<style type="text/css">
@font-face {
    font-family: "Ace Crikey";
    src: url(ace.ttf);
}
.ace {
    font-family: "Ace Crikey";
    font-size: 230%;
}
</style>

вы можете использовать Gimp или другое графическое программное обеспечение и сделать несколько GIF необходимых значков из шрифта Wingdings.