5

ここでアイコンのダウンロードのサイズを変更しようとしています：

http://zurb.com/playground/foundation-icon-fonts-3

ドキュメントでは、次のように述べています。

<i class="fi-[icon]"></i>

たとえば、私は次を使用します：

しかし、サイズは 16px で、どのように変更できるかはわかりません...

4

3 に答える 3

1

フォント アイコン ファンデーションのダウンロード ファイルを見てみましょう。いずれかのアイコンの preview.html にある要素を検査する必要があります。

<i class="step fi-power size-72"></i>

12 から 72 までのサイズを追加してください。

于 2015-06-24T02:34:12.437 に答える
0

まったく同じ外観のアイコンをさらに使用する場合は、ダウンロードした css で font-size を変更して継承し、必要な font-size でローカル css にクラスを作成します。これを任意のプロパティに適用できます。

.fi-yen:before,....,.fi-zoom-in:before,.fi-zoom-out:before 
{
   font-family: "foundation-icons";
   font-style: normal;
   font-weight: normal;
   font-variant: normal;
   text-transform: none;
   line-height: 1;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  text-decoration: inherit;
  font-size:inherit;    #add this
}

そしてあなたのローカルcssファイルで

.icons{
   font-size:25px;
 }

これで、アイコン クラスに加えてこのクラスを使用できるようになりました。あなたのhtmlは次のようになります

<span class="icons"><i class="fi-social-pinterest"></i></span>
<span class="icons"><i class="fi-social-twitter"></i></span>
于 2015-09-11T20:28:53.620 に答える