Html 霓虹灯动画页面不在纸张材质中_Html_Css_Polymer 1.0

Html 霓虹灯动画页面不在纸张材质中

html css

Html 霓虹灯动画页面不在纸张材质中,html,css,polymer-1.0,Html,Css,Polymer 1.0,我的霓虹灯动画页面不会显示在我的纸张材质中在这里，您可以在我的裸体示例中看到，我的霓虹灯动画页面不会显示在纸张材质中。纸张材质由红色边框勾勒出来。理论上，纸张材质应该有一个底部边框以及左右两侧的边框，也包括蓝色div。我的最佳猜测是，霓虹动画页面元素本身中的CSS规则覆盖了正确的行为。任何帮助都将不胜感激，提前谢谢。裸骨样本代码： <!DOCTYPE html> <html> <head> <meta name="v

我的霓虹灯动画页面不会显示在我的纸张材质中

在这里，您可以在我的裸体示例中看到，我的霓虹灯动画页面不会显示在纸张材质中。纸张材质由红色边框勾勒出来。理论上，纸张材质应该有一个底部边框以及左右两侧的边框，也包括蓝色div。我的最佳猜测是，霓虹动画页面元素本身中的CSS规则覆盖了正确的行为。任何帮助都将不胜感激，提前谢谢。

裸骨样本代码：

    <!DOCTYPE html>
<html>
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <script src="bower_components/webcomponentsjs/webcomponents-lite.min.js"></script>
        <link rel="import" href="bower_components/iron-flex-layout/iron-flex-layout.html">
        <link rel="import" href="bower_components/neon-animation/neon-animation.html">
        <link rel="import" href="bower_components/neon-animation/neon-animated-pages.html">
        <link rel="import" href="bower_components/neon-animation/neon-shared-element-animatable-behavior.html">

        <link rel="import" href="bower_components/paper-material/paper-material.html" >
        <style>
        </style>

    </head>

    <body fullbleed unresolved vertical>
        <test-iron-page></test-iron-page>
    </body>

<dom-module id="test-iron-page">
    <style is="custom-style">


        p {
            font-size: 5em;
            margin: 0px;
        }

        paper-material {
            margin: 0px;
            border: 1px red solid;
        }

        .bigDiv {
            background: rgb(0, 148, 255);
            height: 150px;
        }

        .smallDiv {
            background: rgb(0, 255, 144);
            height: 40px;
        }
    </style>

    <template>

        <paper-material elevation="2">

            <div id="headerCont">
                <p>Header</p>
            </div>
            <neon-animated-pages id="nap" selected="0">
                <div class="bigDiv">I am a div</div>
                <div class="smallDiv">I am a div</div>
            </neon-animated-pages>

        </paper-material>

    </template>

</dom-module>

<script>
    Polymer({
        is: "test-iron-page"
    });
</script>

</html>


p{
字号：5em；
边际：0px；
}
纸张材料{
边际：0px；
边框：1px红色实心；
}
比格迪夫先生{
背景：rgb（0148255）；
高度：150像素；
}
斯莫迪夫先生{
背景：rgb（0255144）；
高度：40px；
}
标题
我是一名跳水运动员
我是一名跳水运动员
聚合物({
是：“测试铁页”
});

指定

纸张材料的高度
，下面是高度为300px的工作演示用于纸张材料



模板我
p{
字号：5em；
边际：0px；
}
纸张材料{
边际：0px；
边框：1px红色实心；
高度：300px；
}
比格迪夫先生{
背景：rgb（0148255）；
高度：150像素；
}
斯莫迪夫先生{
背景：rgb（0255144）；
高度：40px；
}
标题
我是一名跳水运动员
我是一名跳水运动员
下一页
聚合物({
是：“试铁页”，
_下一步：函数（）{
this.$.nap.selected=（（this.$.nap.selected+1）%2）；
}
});
为纸张材料指定一个高度