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; } 

到山頂，我的一切文檔中出現一個紅色邊境。這個問題似乎與字體文件本身有關。所有被導入到項目和內容設置爲「複製如果較新」

我試過編輯fontAwesome.css，以便字體文件路徑前面ms-appx-web:///Assets/HTML/。如果沒有工作，我嘗試服用該塊出來，並把它直接在我的文檔，像這樣：

<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的網頁視圖，但這些工作，如果你正在使用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文件。如果那個鏈接不起作用，那裏有很多其他頁面也會這樣做。