angular - Material Design 2 选项卡底部对齐

标签 angular material-design angular-material2

我想让标签在 md-tab-group 的底部对齐,如下所示:

enter image description here

在 Material 1 中使用 md-tabs-align="bottom" 是可能的。 Material 2 中是否有任何可用于此目的的内容?

这是我的代码:

<md-tab-group> 
    <md-tab label="Tab One"> 
        Tab One Contents 
    </md-tab> 
    <md-tab label="Tab Two"> 
        Tab Two Contents 
    </md-tab> 
</md-tab-group>

最佳答案

对于可能偶然发现这个问题的人。

The Tabs section of the component demo site references the following in the API Reference section

@Input()            | Position of the tab header.
headerPosition      |

After looking through the source I found the following:

/** Possible positions for the tab header. */
export type MdTabHeaderPosition = 'above' | 'below';

因此,以下对我有用

<md-tab-group headerPosition="below"> 
<md-tab label="Tab One"> 
    Tab One Contents 
</md-tab> 
<md-tab label="Tab Two"> 
    Tab Two Contents 
</md-tab> 
</md-tab-group>

关于angular - Material Design 2 选项卡底部对齐,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41301877/

相关文章:

android - 如何在 Material 设计工具栏中添加圆形进度微调器

javascript - 在小屏幕上隐藏/显示图像

angular - 如何在 Angular Material 自动完成中过滤对象

angular - 安装angular2时服务器有时会返回500

html - Angular Material Schematics 生成的代码

javascript - 为什么数据绑定(bind)不适用于我的自定义属性指令

android - 工具栏下的 Material Design 固定选项卡

Angular Material MatSnackBar 默认持续时间

angular - 从对象数组中过滤值

express - 获取 Angular 2 通用启动器以部署到外部服务器主机(谷歌云、Azure 等)的步骤?