更改角材料中md-nav-item的高度

Question

請如何覆蓋使用CSS的角材料中的默認高度md-nav-item。我有以下示例代碼：

<div ng-cloak> 
<md-content class="md-padding"> 
    <md-nav-bar 
    md-selected-nav-item="currentNavItem" 
    nav-bar-aria-label="navigation links"> 
    <md-nav-item name="Page1" md-nav-click="goto('page2')"> 
     Link1 
    </md-nav-item> 
    <md-nav-item name="Page2" md-nav-click="goto('page2')"> 
     Link2 
    </md-nav-item> 
    <md-nav-item name="Page3" md-nav-click="goto('page2')"> 
     Link3 
    </md-nav-item> 
    </md-nav-bar> 
    <div class="ext-content"> 
    {{currentNavItem}} 
    </div> 
</md-content> 

還例如參見plunker

Answer 1

檢查的樣式後，你可以做這樣的事情來改變nabvar的高度：

PLUNKER（從角材版本大於等於1.1.0開始工作）

.md-nav-bar, .md-nav-bar > nav, ._md-nav-bar-list, .md-button._md-nav-button{ 
    height: 50px; 
} 

.md-button._md-nav-button { 
    padding: 0; 
    min-height: 0; 
} 

**** 一定包括你的index.html

---

解釋angular-material.css文件後，您styles.css文件：你問變革的md-nav-item的高度，但在實際上，該指令在每個li內寫入/包括ul._md-nav-bar-list和.md-button._md-nav-button。所以，你必須改變.md-button._md-nav-button的高度。但問題是按鈕沒有高度，它們有填充和最小高度。
甚至，主要的問題是.md-nav-bar有一個默認高度（48px），所以如果你改變它裏面的物品的高度，它並不重要，你必須首先覆蓋這個默認的高度。