2012-10-29 34 views
10

Próbuję rozpaczliwie, aby uzyskać moją czcionkę powiększającą, aby była większa. Poniższy kod działa poprawnie w firefoxie, ale nie w Chrome ani IE9.Font-Awesome Jak uzyskać czcionki na dużą skalę?

Czego mi brakuje?

.icon-larger 
{ 
    font-size:50px; 
} 

<div class="search-icon"><i class="icon-search icon-larger"></i></div> 

dziękuję!

+4

mógłbyś zrobić powtarzalne testowy przypadek? –

Odpowiedz

0

Dodaj display:block lub display:inline-block

9

Awesome ikona czcionki jest podpięty do: po elemencie pseudo, więc CSS musiałaby być

.icon-larger:before 
{ 
    font-size: 50px; 
} 

Stworzyłem stronę odniesienia całej zawartości CSS wartości dla Font Awesome, wraz z fragmentem kodu CSS, który pokazuje, jak używać ikon z dowolnym elementem: http://astronautweb.co/snippet/font-awesome/

0

Stare pytanie, ale miałem ten sam problem i wydawało się, że zapomniałem dołączyć czcionki ome css np .: <link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.min.css" rel="stylesheet">

Nadal będzie widoczna ikona, ale nie będzie skali, gdy jej brakuje.

13

Zapoznaj się z tym page i zobacz przykłady, które skalują rozmiar ikon.

Możesz przeskalować do 5 razy jego rozmiar.

Przykład:

<i class="fa fa-camera-retro fa-lg"></i> fa-lg 
<i class="fa fa-camera-retro fa-2x"></i> fa-2x 
<i class="fa fa-camera-retro fa-3x"></i> fa-3x 
<i class="fa fa-camera-retro fa-4x"></i> fa-4x 
<i class="fa fa-camera-retro fa-5x"></i> fa-5x 
Powiązane problemy