フォント恐ろしい背景+サイズ

Question

は長い時間前、私は素晴らしいフォントでこれを作った：私の人生のために

、私はそれを行ってどのように覚えていないことができます。私が使用してそれを複製しようとしたこの：私は上記のコードのために、このリソースを使用

<span class="fa-stack fa-lg"> 
    <i class="fa fa-square-o fa-stack-2x"></i> 
    <i class="fa fa fa-home fa-stack-1x"></i> 
</span> 

： Stacked Icons, Twitter

これに伴う問題は、家が大きすぎる、と背景が同じではないということです私は何年も前に作ったものです（#fffと思う）。フォントワームのウェブサイトでは、明るい背景があるようですが、私のサイト（サイトの背景は＃1F1F1Fです）に実装すると、サイトと同じ背景になるようです。

どのように私は以前これを行うことができました、そして今私は苦労している知っていますか？

Answer 1

問題：あなたはfa-lgクラスを使用している

大きすぎます。これはそれを大型にします。これを削除します。

問題：間違った背景

使用（fa-square-oのような固体の丸い四角形、代わりの概要）fa-squareクラス、および（color: lightgreyで）それが光にするためにCSSを使用しています。

（下の例では、背景も暗くして、正方形の明るい背景をよりよく見せました）。

body { 
 
    background-color: black; 
 
} 
 
.light { 
 
    color: lightgrey; 
 
}

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css"> 
 
<span class="fa-stack"> 
 
    <i class="fa fa-square fa-stack-2x light"></i> 
 
    <i class="fa fa fa-home fa-stack-1x"></i> 
 
</span>