Font Awesome 5：某些 unicode 不會在 html 選擇中顯示
[英]Font Awesome 5: some unicode won't display in html select
問題描述
我有一個包含 2 個項目的 html 選擇，每個項目都應該顯示一個 FA 圖標，但只有一個有效。 這兩個圖標都只有“已售出”版本可用 FA5 免費。 將字體系列更改為“Font Awesome 5 Free”沒有幫助，然后沒有顯示任何圖標。
<html> <head></head> <body> <style> select { font-family: 'FontAwesome'; } </style> <select style='font-weight: 900;'> <option> Broke</option> <option> Working</option> </select> <br/><br/> Code valid as this shows <i class='fas'></i><br/><br/> But displayed icons have the solid style as free and the other styles are pro only<br /> https://fontawesome.com/icons/graduation-cap?style=solid f19d<br /> https://fontawesome.com/icons/th-large?style=solid f009<br /> <script defer src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.0-1/js/all.js" crossorigin="anonymous"></script> </body> </html>
提前致謝
1 個解決方案
解決方案1
0 2020-01-22 14:59:44
您正在使用 JS+SVG 方法加載您的圖標，因此在內容<i class='fas'></i>中使用的圖標將轉換為 SVG。 select 中的 unicde 不在此考慮范圍內，將依賴於font-family: 'FontAwesome' ，這是舊版本，您嘗試顯示的第一個圖標僅存在於 V5 中（與第二個不同）。
要解決您的問題，您需要加載 CSS 版本並更正font-family
select { font-family: 'Font Awesome 5 Free'; }
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.12.0-1/css/all.css"> <select style='font-weight: 900;'> <option> Broke</option> <option> Working</option> </select> <br/><br/> Code valid as this shows <i class='fas'></i><br/><br/> But displayed icons have the solid style as free and the other styles are pro only<br /> https://fontawesome.com/icons/graduation-cap?style=solid f19d<br /> https://fontawesome.com/icons/th-large?style=solid f009 <br />
Google Plus Font Awesome Icon將不會顯示-其余圖標可以正常工作
[英]Google Plus Font Awesome Icon won't display - the rest icons work fine
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.