為什么在select2輸入占位符上在手機上顯示的字體真棒unicode圖標變得混亂不堪？

Question

我正在嘗試將一個占位符圖標插入到select2輸入字段中。

在桌面上查看：

在手機上查看：

這是我使用unicode集成很棒的字體，將圖標放置在輸入字段中的代碼。

玉（我在其中初始化select2的元素）

#tags.icon(type="text", name="tags", placeholder= "   tags...")

和CSS

.select2-input, #searchPosts
  font-family 'FontAwesome'

奇怪的是，當我單擊輸入字段時，鍵入然后清除鍵入內容，然后單擊外部，標記圖標正確顯示。 但是它在加載時無法正確顯示。

Answer 1

Font Awesome和其他圖標網站通常在各種不同平台上都存在兼容性問題。 如果出現unicode，則應具有備份選項，例如sprite。

通常，移動瀏覽器的編碼不同於瀏覽器的Web版本。

有很多方法可以解決此問題，本文是一個不錯的起點： http : //www.creativebloq.com/app-design/icon-fonts-in-apps-21410734

Answer 2

如果沒有調試，我會說您遇到z-index問題或實際的引擎渲染錯誤。 如果可以，請稍后嘗試設置該值。 如果您知道占位符文本是通過添加dom元素實現的，請嘗試增加其z-index。 祝好運。