如何使用 MDL Tabs 将 link 放置在页面中而不隐藏其他内容

Question

我正在使用 Material Design Light "Text Heavy" 模板 page 作为我正在创建的页面的基础。我想使用顶部的选项卡 link 放置在页面中而不隐藏其他内容：即向下滚动到卡片，而不隐藏卡片的上方和下方。

如何实现？

Answer 1

v1.0.x 不支持使用标签作为导航，遗憾的是。不过，它已添加到 master 中，因此它将在 v1.1 中推出！

目前，最好的办法是覆盖面板的样式。因此，只需像往常一样编写所有代码，就像您希望隐藏面板一样，然后覆盖它们的样式：

/* Use an extra class to make sure you only target the
   ones you want. I used 'my-panel' in this example. */
.my-panel.mdl-layout__tab-panel {
  display: block !important;
}

这应该覆盖 mdl-layout__tab-panel 的默认行为，即隐藏。

如果这不起作用，请分享一个代码笔，我应该能够提供进一步的帮助！

如何使用 MDL Tabs 将 link 放置在页面中而不隐藏其他内容

How do I use MDL Tabs to link to places within page without hiding other content

html

material-design-lite