Material Design Liteフォントの問題

Question

私は開発環境としてVisual Studioを使用して新しいウェブサイトを開発し始めました。ナゲットパケットマネージャーでは、私のプロジェクトに「Material Design Lite」を追加しました。私はちょうどいくつかのコンポーネントをテストし始め、1つの問題があります。 私が実装したいと思っていたmenueのコードです。体内の<link href="Content/mdl-v1.1.2/material.min.css" rel="stylesheet" />

：私のhtml頭で

<div> 
    <!-- Left aligned menu below button --> 
    <button id="demo-menu-lower-left" 
      class="mdl-button mdl-js-button mdl-button--icon"> 
     <!-- Intellisense doesn't suggest that font color I just just c&p--> 
     <i style="font-family:Roboto Mono" class="material-icons">more_vert</i> 
    </button> 
    <ul class="mdl-menu mdl-menu--bottom-left mdl-js-menu mdl-js-ripple-effect" 
     for="demo-menu-lower-left"> 
     <li class="mdl-menu__item">Some Action</li> 
     <li class="mdl-menu__item mdl-menu__item--full-bleed-divider">Another Action</li> 
     <li disabled class="mdl-menu__item">Disabled Action</li> 
     <li class="mdl-menu__item">Yet Another Action</li> 
    </ul> 
</div> 

結果

<script src="Content/mdl-v1.1.2/material.min.js"></script> 
    <script src="Scripts/angular.min.js"></script> 

私が取得：

あなたが左上に表示されるようそれは、ただのシンボルではなくプレーンテキストを表示しているだけです。

これを修正するにはどうすればよいですか？ありがとうございました。

Answer 1

フォント設定は、マテリアルデザインのlite css（material.min.css）には含まれていません。セットアップするには
アイコンフォントは、任意のWebページで使用するアイコンフォントを設定する最も簡単な方法は、Googleウェブフォント経由でmaterial-design-icons/

に見ています。これは最初のスタートなのかもしれない

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" 
    rel="stylesheet"> 

：あなたがやらなければならないことは、HTMLの単一の行が含まれています。これはあなたが

または使用Spritesheetsをホスティング自己のようなさまざまな方法について見てやりたいものではない場合MDL stylesに説明：

材料設計のアイコンは、SVGとCSSスプライト用が付属していますアイコンの各カテゴリに含まれています。これらは、svg-spriteとcss-spriteの下のspritesディレクトリにあります。