c# - FontAwesome 未加载到 WebView 中

Question

我在 Windows 应用商店应用程序中使用 Popline，但让图标显示的唯一方法是链接到该文件的引导 CDN 版本。当我尝试引用文件的本地副本时，它不起作用。

这是我到 fontAwesome.css 的路径

<link rel="stylesheet" type="text/css" href="ms-appx-web:///Assets/HTML/css/font-awesome.css">

我知道这是正确的，因为如果我编辑那个文件并添加

* { border: 1px solid red; } 

在顶部，我文档中的所有内容都带有红色边框。问题似乎出在字体文件本身。全部导入到项目中，Content 设置为“Copy if Newer”

我已尝试编辑 fontAwesome.css，以便字体文件路径以 ms-appx-web:///Assets/HTML/ 开头。当这不起作用时，我尝试将该 block 取出并直接放入我的文档中，如下所示:

<style type="text/css" media="screen">
    @font-face {
      font-family: 'FontAwesome';
      src: url('ms-appx-web:///Assets/HTML/fonts/fontawesome-webfont.eot?v=4.2.0');
      src: url('ms-appx-web:///Assets/HTML/fonts/fontawesome-webfont.eot?#iefix&v=4.2.0') format('embedded-opentype'), url('ms-appx-web:///Assets/HTML/fonts/fontawesome-webfont.woff?v=4.2.0') format('woff'), url('ms-appx-web:///Assets/HTML/fonts/fontawesome-webfont.ttf?v=4.2.0') format('truetype'), url('ms-appx-web:///Assets/HTML/fonts/fontawesome-webfont.svg?v=4.2.0#fontawesomeregular') format('svg');
      font-weight: normal;
      font-style: normal;
    }
</style>

谁能看出我做错了什么？

更新

请注意我正在使用 NavigateToString 加载我的 html。这是绝对必要的，没有办法解决它，因此解决方案必须适用于 NavigateToString

Answer 1

经过反复试验，我终于找到了如何做到这一点。如果您使用 Source，有几种解决方案可以使用属性将 HTML 放入 WebView，但如果您使用 NavigateToString，这些都不起作用

这个，来自Matt Small's blog ， 做。

@font-face {
    font-family: 'FontAwesome';
    src: url(data:application/x-font-woff;charset=utf-8;base64,<BASE64 STRING OF fontawesome-webfont.woff>) format('woff'), 
        url('ms-appx-web:///fontawesome-webfont.ttf?v=4.2.0') format('truetype');
    font-weight: normal;
    font-style: normal;
}

您需要将此代码放入 HTML 文件的头部。如果在单独的 css 文件中，这将不起作用。

您可以使用 this page转换您的 fontawesome-webfont.woff 文件。如果该链接不起作用，那么还有很多其他页面也可以这样做。