Angularjs 更改md选项卡按钮高度

我想把我的标签按钮改小/薄。我通过DOM查找css的所有指针，例如：

md-tabs-canvas.md-center-tabs{
height: 10px;
}
md-tabs-wrapper{height: 10px;}
md-pagination-wrapper{height: 3px;}

但是我不能达到我想要的高度。 或者我需要用

ng隔离作用域

CSS来重新安排这个指针的命题

更新 这是代码笔中的代码

---

这是生产中的代码更新：

我尝试更改GitHub页面上md选项卡项的填充，结果成功了。 请参见屏幕截图：。md选项卡项的填充使元素变大

将css更改为：

md-pagination-wrapper {
    height: 30px;
}
md-tab-item {
    padding: 5px !important;
}

---

更新：

我尝试更改GitHub页面上md选项卡项的填充，结果成功了。 请参见屏幕截图：。md选项卡项的填充使元素变大

将css更改为：

md-pagination-wrapper {
    height: 30px;
}
md-tab-item {
    padding: 5px !important;
}

---

我验证了上面的答案，效果很好。但是，为了避免更改过于通用，从而影响

md选项卡的每个实例，同时也为了避免需要
！重要信息
，请使用自定义父容器ID或类限定CSS类

另外，如果您只想影响高度，则只修改填充顶部，例如：

#myTabsContainerParent .md-pagination-wrapper {
    height: 30px;
}
#myTabsContainerParent .md-tab-item {
    padding-top: 5px;
}

我验证了上面的答案，效果很好。但是，为了避免更改过于通用，从而影响
md选项卡的每个实例，同时也为了避免需要
！重要信息
，请使用自定义父容器ID或类限定CSS类

另外，如果您只想影响高度，则只修改填充顶部，例如：

#myTabsContainerParent .md-pagination-wrapper {
    height: 30px;
}
#myTabsContainerParent .md-tab-item {
    padding-top: 5px;
}

将HTML代码发布为well@NagaveerGowda更新的codepost HTML代码为well@NagaveerGowda更新的代码很好，它似乎与codepen一起工作，但与我的GitHub页面不起作用。我想你可能忘记了关键字“！important”，或者它应该可以工作。在我的更新中查看。您可以在浏览器中使用F12，将鼠标悬停在相关元素上，并更改每个相关元素的高度/宽度/填充/边距。然后你可以找到哪个元素的css对你的案例起决定性作用。非常感谢，我很快会接受你的建议和反馈：）好吧，它似乎与codepen一起工作，但与我的GitHub页面不起作用。我想你可能忘记了关键字“！important”，或者它应该可以工作。在我的更新中查看。您可以在浏览器中使用F12，将鼠标悬停在相关元素上，并更改每个相关元素的高度/宽度/填充/边距。然后，您可以找到哪个元素的css对您的案例起决定性作用。非常感谢，我将很快在这里听取您的建议和反馈：）