字體真棒統一移動

Question

我有一個貨幣選擇這樣的：

<select class="new-challenge-bet-currency"> 
    <option value="usd">&#xf155;</option> 
    <option value="eur">&#xf153;</option> 
    <!-- keeps going with more currencies --> 
</select> 

一切正常，在桌面瀏覽器和手機瀏覽器甚至還可以顯示在selected項目fa貨幣符號。

下面是在Chrome的Android會發生什麼的屏幕截圖。正如你所看到的，所選擇的貨幣（$）在頂部顯示效果細膩，但彈出時，它的時間來選擇不同的選項只顯示破X盒白框。

不知道如何讓他們的工作？尋找一個簡單的解決方案，所以我不必重新做一遍貨幣選擇。

Answer 1

它不只是手機，還有歷來在造型<option>，因爲它已經被本地OS小部件，而不是瀏覽器的DOM渲染了難度。如果您確實必須完全控制<select>框的顯示，您需要將其替換爲腳本元素。 （參見select2等）

但是目前還不清楚我爲什麼要使用專用區字符定製字形呈現爲其中有非常好的Unicode字符（U + 0024美元符號，U + 20AC貨幣符號歐元符號）可用。如果您可以使用真正的Unicode字符（如果您願意，還可以使用自定義字體渲染），那麼當它們被這樣的非瀏覽器小部件顯示時，它們應該仍然可用。