フォントを使いながらフォントサイズを変更するにはどうすればよいですか？

私は個人的なレジュームサイトを開設しました。私は本当にクールなものを見つけました：font awesome、CSSを使ってフォント効果を追加できるテキストのグラフィックスを提供します。私の問題は、フォントサイズを変更しようとするまで、すべてがうまくいきました。なぜなら何らかの理由で変わらないからです。あなたはなにか考えはありますか？私はここでも新しいですし、私は投稿をする方法を読みましたが、私が間違っていると私に知らせてください。フォント素晴らしいアイコンのサイズを決定する好ましい方法ではありませんフォントを使いながらフォントサイズを変更するにはどうすればよいですか？

*{ 
    margin: 0; 
    padding: 0; 
    text-decoration: none; 
    list-style: none; 
} 

.toggle_menu{ 
    position: fixed; 
    padding: 15px 20px 15px 15px; 
    margin-top: 70px; 
    color: white; 
    cursor: pointer; 
    background-color: #648B79; 
    z-index: 1000000; 
    font-size: 8em; 
}  

<!DOCTYPE html> 
<html> 
<head> 
    <!-- Stylesheets --> 
    <link rel="stylesheet" type="text/css" href="css/style.css"> 
    <!-- Fonts --> 
    <link href='https://fonts.googleapis.com/css? 
family=Open+Sans:400,600,700,800,300' rel='stylesheet' type='text/css'> 
    <!-- Scripts --> 
    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> 
    <script src="js/menu.js"></script> 
    <script src="https://use.fontawesome.com/53686df37f.js"></script> 
    <title>Joseph Kuzera</title> 
</head> 
<body> 
    <i class="fa fa-bars toggle_menu"></i> 
</body> 
</html>

出典

2017-04-13 BestThereEverWas

可能な複製、およびフォントの恐ろしいアイコンの影]（http://stackoverflow.com/questions/12272372/how-to-style-icon-color-size-and-shadow-of-font-awesome-icons） – TylerH

..私はそれがどちらかfont-sizeで行うことができることを確認していません。

<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

http://fontawesome.io/examples/

出典

2017-04-13 21:59:36 Zak

ありがとうございましたこれはありがとう非常に便利な – BestThereEverWas

font-awesomeアイコンは、単にfont-sizeを使ってサイズを変更することができます。これはFONTであり、グラフィックではありません。組み込みクラスを使用すると、クラスを介して適用されます。また、大量のFAアイコンを使用していない限り、完全なCSSの代わりに必要なアイコンを追加するだけで役立ちます。 FAが動作するために必要な合計は、約10行のCSSと、フォントワームフォントローダーと、コンテンツを持つ各クラスです。 – junkfoodjunkie

再サイズに一方通行のフォントです：フォント素晴らしい例ページあたり。しかし、それらのサイズのどれもあなたが望むものを持っていない場合はどうなりますか？ font-sizeを使う必要があります。

フォントサイズがレンダリングされない理由は、.fa classにfont-size:inherit;があるためです。それが上書きされている理由です。 http://jsfiddle.net/1Lf0rowp/43/

しかし、上記のコードは、クラスで処理するフォントサイズを組み込んでいるので、より効率的です。

出典

2017-04-13 22:06:52 Jorden1337

アイコンが.faに:before psuedoelementsによって作られていますので、あなたの代わりに.faの:beforeを対象かどうかは、アイコンにまっすぐになるだろう：

.toggle_menu{ 
position: fixed; 
padding: 15px 20px 15px 15px; 
margin-top: 70px; 
color: white; 
cursor: pointer; 
background-color: #648B79; 
z-index: 1000000; 
} 
.toggle_menu:before { 
font-size: 8em; 
}

[アイコンの色のスタイルを設定する方法、サイズの

出典

2017-04-13 22:24:56 TricksfortheWeb

いいえupvote何も？、これは受け入れる必要があります答えは、 – user2860957

フォントを使いながらフォントサイズを変更するにはどうすればよいですか？

答えて

関連する問題