Polymer 是否可以将静态页脚添加到核心抽屉面板?

Polymer 是否可以将静态页脚添加到核心抽屉面板?,polymer,Polymer,我正在使用核心抽屉面板创建应用程序。核心抽屉面板允许您创建抽屉和主标题。如果我在应用程序中没有显示任何文本,那么我假设所有内容都需要进入应用程序中才能看到 如果我想创建一个静态的页脚,比如topeka的状态栏,我该怎么做呢?是否可以使用core drawer panel?页脚需要位于使用core drawer panel的主属性指定的元素内 footer { position: fixed; background: white; width: 100%; bottom: 0; }

我正在使用核心抽屉面板创建应用程序。核心抽屉面板允许您创建抽屉和主标题。如果我在应用程序中没有显示任何文本,那么我假设所有内容都需要进入应用程序中才能看到


如果我想创建一个静态的页脚,比如topeka的状态栏,我该怎么做呢?是否可以使用core drawer panel?

页脚需要位于使用core drawer panel的主属性指定的元素内

footer {
  position: fixed;
  background: white;
  width: 100%;
  bottom: 0;
}

<core-drawer-panel>
  <core-header-panel drawer>
    ...
  </core-header-panel>
  <core-header-panel main>
    <core-toolbar>asdf</core-toolbar>
    <div fit>
      <footer>Sticky Footer!</footer>
    </div>
  </core-header-panel>
</core-drawer-panel>
演示:


演示:

通常按照指导原则,当您使用移动视图时,左侧导航将不可见,您应该在主部分底部创建页脚,而不是在两部分底部创建页脚Saved me,@ebidel!聚合物布局属性FTW!一位朋友说要避免这种情况:固定的,因为它在手机上的性能很差,如果你需要多次固定,它可能会成为一个问题。
<style>
.content {
    overflow-y: scroll;
}
footer {
    background: rgba(255, 0, 0, 0.2);
    height: 50px;
    padding: 10px 15px;
}
</style>

<core-drawer-panel>
    <core-header-panel drawer>
        <core-toolbar>...</core-toolbar>
        <div> Drawer content... </div>
    </core-header-panel>
    <core-header-panel main>
        <core-toolbar>Toolbar title</core-toolbar>
        <div fit vertical layout>
            <header>Top text</header>
            <div flex class="content">
                ...
            </div>
            <footer>Footer!</footer>
        </div>
    </core-header-panel>
</core-drawer-panel>