“core-header-panel”似乎并不是开箱即用的

时间:2014-06-29 09:34:13

标签: polymer web-component

我正在尝试一些core聚合物元素,而我在my demo中使用core-header-panel时遇到了问题。

我认为工具栏是正确的,因为我设法another demo使用最小的CSS。但我发现的核心标题面板的所有演示似乎都采用了组件外部的大部分布局配置(这似乎是组件的一点)。我在这里误解了什么吗?

2 个答案:

答案 0 :(得分:8)

今天最好的模式是使用聚合物布局属性。

<body fullbleed vertical layout>
  <core-header-panel flex>

vertical layout使主体成为(垂直)弹性框,flex上的core-header-panel属性将使其填充可用空间。 fullbleed属性设置body以适合视口。

这是一种比使用fit更好的模式,因为弹性框更具弹性。您可以向body添加不同的页眉或页脚,Flex面板将适应。

此外,使用layout容器和flex子容器是一种模式,您可以继续在应用程序的其他位置使用。

答案 1 :(得分:2)

根据聚合物网站核心标题面板总是需要明确设置高度。 http://www.polymer-project.org/docs/elements/layout-elements.html

尝试使用fit属性(http://www.polymer-project.org/docs/polymer/layout-attrs.html):

<core-header-panel fit>
  ....
</core-header-panel>