有(至少)两种显示比特币符号的方法。
如果您愿意,可以使用字体真棒和样式:
.fa-btc {
font-size: 75%;
color:#6f42c1;
opacity: 0.8;
vertical-align: -5%;
font-variant: small-caps;
}
另一种方法是只显示新的Unicode字符20BF
:
.bitcoin::before {
font-size: 80%;
opacity: 0.8;
vertical-align: 10%;
content: "\20BF";
}
我更喜欢unicode方式。我觉得它更微妙。
但它还没有在Android上运行。显然在Android网络浏览器上进行渲染的Roboto和Nono字体还没有。
请注意,我正在为我的网站下载一个带有该符号的字体,因此我很困惑为什么Android没有使用它:
<!--website font-->
<link href="https://fonts.googleapis.com/css?family=Roboto|Roboto+Mono" rel="stylesheet">
在unicode无法使用的情况下,检测并显示fa图标的方法是什么?
理想情况下,我想关闭实际使用的字体中可用的unicode符号,而不是仅查看操作系统或其他可能符合或不符合可用符号的内容。 。我在Android操作系统上查找和使用具有此符号的某种字体也是一个很好的答案。 我没有标记 Android ,因为这不是Android开发;恰好是提醒我这个问题的环境。
答案 0 :(得分:0)
我结合了几个关于检测豆腐字符和替换::before content
的答案,并想出了这个答案。
$(document).ready(function(){
var bitcoinSymbolAvailable = document.getElementById('char-to-check').offsetWidth !== document.getElementById('not-renderable').offsetWidth;
if(!bitcoinSymbolAvailable)
$('body').append('<style>.bitcoin:before{content:"\\0E3F" !important;}</style>');
});
.bitcoin::before {
font-size: 80%;
opacity: 0.8;
vertical-align: 10%;
content: "\20BF"; /* \0E3F */
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
<img width="200" src="https://img.cinemablend.com/filter:scale/quill/9/a/d/3/5/0/9ad35052cecea0ff468e2f03476d9e8e385add82.jpg?mw=600">
<h1>But first you must pay me... <span class="bitcoin">1,000,000</span>
</div>
<div style="position:absolute;visibility:hidden;">
<span id="char-to-check">₿</span>
<span id="not-renderable"></span>
</div>