降解Unicode字符的網絡瀏覽器，缺少字體

我使用Unicode「查馬克」（U + 2713），一個html文件內。我發現它在大多數瀏覽器中呈現OK，但偶爾會遇到某人在PC上丟失字體。如果字體丟失，是否有任何HTML/JS技巧來指定替代顯示字符（或圖像）？降解Unicode字符的網絡瀏覽器，缺少字體

來源

2010-09-02 Chris Brent

我喜歡這個問題。在一個複雜的系統中，在不同抽象層次上的問題組合是恰當的。 – 2010-09-02 23:57:03

（不，我無法回答。） – 2010-09-02 23:57:27

這裏沒有一個直接的方式告訴如果任何特定的字符以有用的方式已使。關於JavaScript所能做的所有事情就是創建一個包含目標字體中一個（或多個）目標字符的<span>，並將其寬度與包含相同數量的字符的另一個<span>進行比較，該字符不會有用地渲染（*）。如果它們的寬度相同，則可能會出現各個框中的問題或問號，因此您可以採取備份措施，如添加圖像。

由於這是一個相當大量的麻煩，你可能更願意只去的圖像。或者，您可以嘗試在現代瀏覽器中嵌入@font-face以使用一般已知的字體。由於通常IE的Unicode字體後備支持較差，因此請確保包含EOT字體。（*：你可以嘗試一個當前未分配的角色，並希望保持這種狀態，例如U + 08FF，或者保證無效的角色，比如U + FFFF，儘管你是否應該允許這樣做在HTML文檔。）

來源

2010-09-04 07:12:09 bobince

-1

Unicode是非常標準的，我總是用unicodemap.org。這裏是你使用[link]的字符，這會給你與複選標記相關的所有代碼。如果您想要完全向後兼容，則需要使用實際圖像。 1複選標記的圖像文件比JavaScript hack /插件更輕量。可能是你最好的選擇。

來源

2010-09-02 23:58:27 stephenway

對這個問題的回答，前兩句是非常虛假的。我相當肯定你可以假設他們能夠在文檔中正確地嵌入一個字符，並且他們明確指出缺少的字體是一個問題，而不是其他問題。 – Joey 2010-09-03 10:01:21

我提供的替代代碼可以幫助解決他們的問題，因爲該代號可以用不同的代碼實現。而且我還提供了一種解決方案，可以爲100％的用戶提供服務，並且不會通過黑客加載站點。 – stephenway 2010-09-03 16:20:57

如果你能想出一個方法來遠程檢查是否安裝MS Office 2000或更新，你應該能夠假設安裝宋體的Unicode MS，因此具有在字體這段代碼點（只要你將CSS字體系列設置爲「Arial Unicode MS，Arial，sans-serif」）。

我相信這將僅在Microsoft Internet Explorer的工作，但你應該能夠通過努力在JavaScript中創建的ActiveX對象來檢測一個Word安裝：

if(new ActiveXObject("Word.Application")) 
{ 
    window.alert("Word is installed, go ahead and use the Unicode check mark in HTML"); 
} 
else 
{ 
    window.alert("Word is not installed, use your image of a check mark."); 
}

但考慮到這真的只是在工作IE，可能會在IE8中引發安全警告，並且您還需要其他瀏覽器或沒有MS Office的IE瀏覽器的回退機制，所以始終使用映像可能是最佳途徑。

來源

2010-09-07 15:11:52 userx

Word ActiveX控件甚至標記爲腳本安全嗎？我對此表示懷疑。此外，Arial Unicode MS是迫使用戶的一個可怕選擇。它造成的傷害比好的傷害更大。 – Joey 2010-09-21 15:57:15

@Joey - 我相信它可以用在IE6和IE7的腳本中。 IE8發出安全警告。對於傳統方式無法解決的問題（JavaScript中沒有「此字體已安裝」或「瀏覽器中的此字符使用字體」功能），這是一項可行的解決方法。我不知道你爲什麼拒絕投票，這是一個可行的解決方案。最好的，可能不是（我認爲我發佈的其他答案可能會更好）。另外，我不確定爲什麼Arial Unicode MS在你知道它具有Unicode字符時是一個非常糟糕的選擇，只要你適當地回退。 – userx 2010-09-21 17:02:34

這不是你問了好東西，但它可能會解決你的問題（假設你的目標是輸出HTML內無需依靠外界的圖像等）

你有沒有考慮圖像數據的URL （也被稱爲RFC2397）： http://www.ietf.org/rfc/rfc2397.txt

而不是使用：

&#x2713;

代表複選標記，你可以使用：

<img src="data:image/gif;base64,R0lGODlhCgAKAJEAAAAAAP///////wAAACH5BAEAAAIALAAAAAAKAAoAAAISlG8AeMq5nnsiSlsj 
zmpzmj0FADs="/>

這將不需要任何特別的Unicode字體與複選標記字符將在客戶端安裝，但它不會在Internet Explorer 7或更低的工作。（Internet Explorer 8，Firefox，Safari等應該工作得很好）

來源

2010-09-08 03:44:00 userx

+1不錯！你是如何將Unicode字體轉換爲base-64編碼的？你有沒有先做過GIF圖像？ – kol 2013-09-26 11:24:09

@kol - 是的，它只是一個角色的形象。但鑑於這個答案已經過去3年了，現在更好的方法是使用[WOFF]（http://en.wikipedia.org/wiki/Web_Open_Font_Format）而不是我的骯髒的黑客。 – userx 2013-09-26 18:26:00

降解Unicode字符的網絡瀏覽器，缺少字體

回答

相關問題