Как использовать iemoji на грани

#html #emoji

Вопрос:

У меня есть этот код :

 <option> amp;#x1F1E9;amp;#x1F1EA; Deutsch</option>
or 
<option> amp;#127465;amp;#127466; Deutsch</option>

 

и я получаю это в Firefox :
введите описание изображения здесь

но на грани это выглядит так :
введите описание изображения здесь

Что я сделал не так ?

Ответ №1:

К сожалению, Windows поставляется без системного шрифта Emoji, содержащего красочные лигатуры флагов (и многие другие символы из Emoji land). Поскольку Chrome и Edge полагаются на системные шрифты, мы видим эти простые символы, а не лигатуру.

Firefox (по-прежнему) встраивает свой собственный приятный резервный шрифт Emoji на основе твиттеров («Twemoji Mozilla»), чтобы смягчить это. Таким образом, единственный способ заставить его работать в разных браузерах-это предоставить webfont.

Существует удобный шрифт Twemoji от Mozilla, скомпилированный для использования в Интернете Максимом Эузиером по адресу https://xem.github.io/unicode13/emoji.html :

 /*
Licenses for TwemojiMozilla.ttf: https://github.com/mozilla/twemoji-colr/blob/master/LICENSE.md#license-for-the-visual-design
Derived from: https://twemoji.twitter.com/
Source: https://xem.github.io/unicode13/emoji.html 
*/
@font-face {
  font-family: "Twemoji from xem.github.io";
  src: url("https://xem.github.io/unicode13/Twemoji.ttf") format("truetype");
  unicode-range: U 00A9-E007F;
  /* @see https://github.com/mozilla/twemoji-colr/issues/56 */
}

:root {
  font-family: "Twemoji from xem.github.io", Segoe UI Emoji, Segoe UI Symbol, Segoe, sans-serif;
} 
 <p>amp;#x1F1E9;amp;#x1F1EA; Deutsch 

Комментарии:

1. не красиво, но приемлемо :))

2. «К сожалению, Windows поставляется без системного шрифта эмодзи, содержащего красочные лигатуры флагов ( и многие другие символы из страны эмодзи )». @myf: Единственные эмодзи Unicode, не поддерживаемые в Windows, — это флаги. (Эмодзи флагов всегда были плохой идеей, но, к сожалению, один из крупных поставщиков решил поддержать их, и другие последовали его примеру. Я думаю, что сейчас они все сожалеют об этом.)

3. @PeterConstable Хороший момент, я, вероятно, находился под очень устаревшим впечатлением от 2016 года или из отчетов о замороженных корпоративных установках-я помню, как довольно регулярно натыкался на «монохромные» или «тофу» «смайлики» в Chrome в Windows, в то время как Firefox отображал свою вилку Twemoji. Но я вижу, что, возможно, это был просто неправильный стек шрифтов, избегающий эмодзи Segoe UI, в конце концов (?), обновление 2019 года кажется довольно лаконичным ( blog.emojipedia.org/diverse-emoji-families-come-to-windows ) Я согласен, что вся эта механика флагов, ну, по крайней мере, интересна, я не слишком задумывался над этим.