Семейство шрифтов Wingdings не работает в Firefox и Opera.

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

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

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


person niko    schedule 22.10.2011    source источник


Ответы (6)


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

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

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

person mddw    schedule 22.10.2011
comment
Начиная с Unicode v7, все символы из Webdings и Wingdings были добавлены в Unicode ([1] , [2]). - person GSerg; 03.10.2014
comment
Я не понимаю, о чем говорится на странице Алана Вуда, и я не могу найти ничего на сайте w3c, где говорится о стандартных шрифтах. wingdings, кажется, проверяет OK, используя валидатор w3c css. Очевидно, что если кто-то использует устройство, на котором не установлен определенный шрифт, браузер заменит другой шрифт, но это не то, о чем говорит OP. - person Andy; 23.10.2015
comment
Есть ли инструмент для преобразования Windings в стандартные символы Unicode? - person Ky Leggiero; 14.12.2015
comment
@Энди. Под нестандартными они на самом деле подразумевают не соответствующие стандартам. Так как шрифт не соответствует стандарту Unicode. Например, байт 0x74 в UTF-8 должен отображать заглавную букву J. Но вместо этого wingdings отображает смайлик. Почему это проблема? Потому что предполагается, что шрифты изящно деградируют в тех случаях, когда у пользователя не установлен целевой шрифт. Если шрифт не соответствует стандарту, он не деградирует изящно. Любой, у кого на компьютере не установлен Wingdings (шрифт Microsoft), вместо этого увидит мусорный текст. - person daiscog; 01.12.2016

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

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

person Joseph Marikle    schedule 22.10.2011
comment
Примечание. Обязательно используйте поддерживаемый шрифт. Это не работает в 95% шрифтов, установленных на моей машине. - person Wesley Murch; 23.10.2011
comment
Исправление: согласно локальному тестировщику шрифтов сайта, он мало поддерживается, но Firebugging этих шрифтов, встроенных в эту страницу, похоже, работает - на самом деле я не могу заставить его не работать, так что это загадка для меня. - person Wesley Murch; 23.10.2011
comment
Уэсли: в соответствии с правилами сопоставления шрифтов CSS неизвестные глифы в текущем выбранном шрифте приводят к тому, что графема отображается с использованием другого шрифта. - person gsnedders; 23.10.2011
comment
@gsnedders: Приятно слышать, не могли бы вы случайно указать мне ссылку на это? - person Wesley Murch; 25.10.2011
comment
@gsnedders: Большое спасибо! Еще больше причин для указания универсального семейства шрифтов, такого как serif. - person Wesley Murch; 25.10.2011
comment
Установите font-size на что-то большее, чем шрифт, который вы бы использовали в сочетании с CSS ::after или ::before и content, но не делайте это универсально для каждого символа Unicode, поскольку они сильно различаются по размеру. - person John; 09.09.2015

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

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

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

person Christoph Lipka    schedule 22.05.2012
comment
Это технически правильно и помогает понять природу проблемы, но в соответствии со стандартом Unicode символы частного использования не должны использоваться в обмене информацией, кроме как по частным соглашениям. В этом случае, если фактически используемый шрифт отличается от шрифта, объявленного в CSS, отображается общий символ неотображаемого символа (или иногда любой символ, который какой-то другой шрифт присвоил той же позиции кода). - person Jukka K. Korpela; 04.12.2012

Цитировать сайт:

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

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

person orangething    schedule 22.10.2011
comment
Это 2005 года, еще актуально? Есть ли какой-нибудь полезный совет в статье для OP? - person Wesley Murch; 23.10.2011

@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>
person Grumpy    schedule 22.10.2011

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

person Eddy Freddy    schedule 22.10.2011