Question

我做了一个简单的例子来在网页中显示核心标题面板（Polymer web-component）。但我在浏览器中看不到任何内容，并且de控制台（Chrome）也没有错误。

有人可以告诉我我做错了什么吗？我想我至少应该看看core-header-panel中的文本。

代码：

<!doctype html>
<html>

<head>
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">

<script src="bower_components/platform/platform.js"></script>

<link rel="import" href="bower_components/core-header-panel/core-header-panel.html">
</head>

<body unresolved touch-action="auto" fullbleed vertical layout>

<core-header-panel fit>
<div class="core-header">Welcome</div>
<div class="content">Bla bla bla</div>
</core-header-panel>
</body>

</html>

Answer 1

默认情况下，core-header-panel没有任何明确的高度，因此通常需要告诉它填充其父级。您已使用标题面板上的fit属性和正文上的fullbleed（因此正文为100％高度）来完成此操作。

我只是将你的代码扔进了jsbin，我看到了标题面板的内容显示出来了。 http://jsbin.com/letat/2/edit

您使用的是Chrome浏览器还是其他浏览器？

Answer 2

您确定您的platform.js导入是否已正确映射？

我复制了你的代码，我看到你的两行，但没有看到聚合物元素。我猜你的platform.js是不正确的。

core-header-panel不可见？

2 个答案: