Angular2マテリアルmdアイコンのサイズ

Question

angle2のフォントの相対的な大きさで動作するようにアイコンサイズを取得するにはどうすればよいですか？

<div style="font-size: 3em;"> 
<md-icon>highlight</md-icon> 
Title 
</div> 

Answer 1

をあなたのCSSファイルでフォントサイズ、高さと幅を変更することにより、MD-アイコンのサイズを変更することができます。例：

md-icon.size-45 { 
    font-size: 45px; 
    height: 45px; 
    width: 45px; 
} 

Answer 2

これには2つの方法があります。

あなたは合字自体に影響を与えることができます：

<md-icon><h1>highlight</h1></md-icon> 

これは、アイコンのサイズを変更しますが、それは（font-weightのような）ヘッダ要素に設定されたスタイルに影響されます。だから、は、私はCSSを使用してリサイズをお勧めします：

<md-icon style="font-size:24px">highlight<md-icon> 

これはカリッ、アイコンのサイズを変更します。あなたはもちろん、（でも優れている！）それを行うためにクラスを追加することができます

<md-icon class="large">highlight<md-icon>