为了账号安全,请及时绑定邮箱和手机立即绑定

如何防止Unicode字符在JavaScript中从HTML呈现为表情符号?

/ 猿问

如何防止Unicode字符在JavaScript中从HTML呈现为表情符号?

如何防止Unicode字符在JavaScript中从HTML呈现为表情符号?

我正在从FileFormat.Info的搜索中找到特殊字符的Unicode 。

某些字符呈现为经典的黑白字形,例如⚠(警告标志\u26A0⚠)。这些是首选,因为我可以将CSS样式(如颜色)应用于它们。

其他人正在渲染为更新的卡通表情符号,例如hour(沙漏\u231B或者⌛)。这些不是优选的,因为我不能完全定型它们。

看来浏览器正在进行此更改,因为我能够在Mac Firefox上看到沙漏字形,而不是Mac Chrome或Mac Safari。

有没有办法强制浏览器显示旧的(单调单调)版本?

更新:看来(从下面的评论)有一个文本显示选择FE0E,可用来执行文本VS-表情符号。选择器作为后缀连接到字符的代码上,没有空格,例如⌛︎HTML十六进制或\u231B\uFE0EJS。但是,它并没有被所有浏览器(例如Chrome和Edge)所尊重


查看完整描述

3 回答

?
慕桂英4014372

附加用于强制文本的Unicode变体选择器字符VS15 , ︎
这会强制将前一个字符呈现为文本而不是表情符号。

<p>🔒&#xFE0E;</p>

结果:🔒︎

了解更多信息:Unicode符号作为文本或表情符号


查看完整回答
反对 回复 2019-08-17
?
慕盖茨1488219

我有一个像span::before内容这样的Unicode字符。Chrome使用“Segoe UI Emoji”作为渲染它的字体。即使我将字体系列设置为“Segoe UI Symbol”,它也无效。

但是,当我明确地将font-family设置为“Segoe UI Symbol”时span::before,而不仅仅是for span,那么它就可以了。


查看完整回答
反对 回复 2019-08-17
?
慕瓜9086354

Android字体并不像您期望的那样丰富。字体文件没有这些奇特的字形,Android有一个没有字形的少数字符的黑客。它们被图标取代。

所以解决方案是将网站与网络字体(woff)集成。使用FontForge创建新的字体文件,并从免费的serif TTF中选择所需的字形。每个字形需要1k。生成woff文件。

准备简单的CSS以导入自定义字体系列。

style.css中:

@font-face {
  font-family: 'Exotic Icons';
  src: url('exotic-icons.woff') format('woff');}.exotic-symbol-font {
    position: relative;
    top: 1px;
    display: inline-block;
    font-family: 'Exotic Icons';
    font-style: normal;
    font-weight: normal;
    line-height: 1;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;}

index.html文件:

<html>
  <head>
    <meta charset="utf-8">
    <link href="style.css" rel="stylesheet"></head>
    <title>Test custom glyphs</title>
  </head>
  <body>
    <table>
      <tr>
        <td class="exotic-symbol-font">
            😭 ☠ &#x2660; a  g        </td>       
      </tr>
    </table>
  </body></html>


查看完整回答
反对 回复 2019-08-17

添加回答

回复

举报

0/150
提交
取消
意见反馈 邀请有奖 帮助中心 APP下载
官方微信