angular2-mdlヘッダーの色と高さを変更してください

Question

私は角度cliプロジェクトでスタイリングにangular2-mdl（http://mseemann.io/angular2-mdl/）を使用しています。

<div class="demo-container" mdl-shadow="2"> 
<mdl-layout mdl-layout-fixed-header mdl-layout-header-seamed> 
    <mdl-layout-header> 
    <mdl-layout-header-row> 
    <mdl-layout-title>AMM</mdl-layout-title> 
    <mdl-layout-spacer></mdl-layout-spacer> 
    <!-- Navigation. We hide it in small screens. --> 
    <nav class="mdl-navigation"> 

    <!-- logout --> 
    <button mdl-button mdl-button mdl-button-type="icon" (click)="logout()"> 
    <mdl-icon>exit_to_app</mdl-icon> 
    </button> 
</nav> 
</mdl-layout-header-row> 
</mdl-layout-header> 
<mdl-layout-content> 
<!-- Your content goes here --> 

<div class="mdl-grid"> 

</div> 
</mdl-layout-content> 
</mdl-layout> 
</div> 

は、私は私のヘッダーのスタイルをカスタマイズしたい：私はカスタムカラーを使用したいと私は、ヘッダーとナビゲーションを定義

<link rel="stylesheet" href="https://code.getmdl.io/1.1.3/material.indigo-pink.min.css" /> 
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> 
<link href="https://fonts.googleapis.com/css?family=Pacifico" rel="stylesheet"> 

私の主な内容として私のindex.htmlにデフォルトのCSSを追加しました私はそれのために自分の高さを定義したい。

どうすればこの問題を解決できますか？私は何をどこで修正しなければならないのですか？

注：テーマ全体を変更したくない場合は、ヘッダーを変更するだけです。

Answer 1

高さと色についてmdl-layout-headerを上書きする方法もあります。だから、ナビゲーションバーコード（HTML）

<mdl-layout-header class="custom"> 
    <mdl-layout-header-row> 
     ... 
     ... 
     ... 
    </mdl-layout-header-row> 
</mdl-layout-header> 

Answer 2

は、私はあなたが