不良造型聚合物元件

Question

我在设计聚合物纸纽扣元素时遇到麻烦。 在下面的示例中，我不确定为什么我的#rate样式没有应用到纸张按钮。

 <script src="http://www.polymer-project.org/platform.js"></script> <link rel="import" href="http://www.polymer-project.org/components/polymer/polymer.html"> <link href="http://www.polymer-project.org/components/paper-button/paper-button.html" rel="import"> <polymer-element name="my-element" noscript> <template> <style> :host #rate { background: yellow; color: green; height: 25px; line-height: 8px; margin: 0; text-transform: none; } </style> <paper-button id="rate">rate/reply</paper-button> </template> </polymer-element> <my-element></my-element> 

Answer 1

:host #rate更改为#rate

 <script src="http://www.polymer-project.org/platform.js"></script> <link rel="import" href="http://www.polymer-project.org/components/polymer/polymer.html"> <link href="http://www.polymer-project.org/components/paper-button/paper-button.html" rel="import"> <polymer-element name="my-element" noscript> <template> <style> #rate{ background:red;; color: yellow; height: 40px; width:100px; margin: 0; text-transform: none; } </style> <paper-button id="rate">rate/reply</paper-button> </template> </polymer-element> <my-element></my-element> 

Answer 2

如果我复制您的代码，则样式部分将不适用，但是如果我使用所有相同的信息手动重新输入：host #rate {..}，它将正常工作。 可能是一个隐藏的字符导致解析问题。

好吧，这是一个很有趣的事情，只是在notepad ++中确认您的缩进是带有制表符的，看起来就像是聚合物解析器中的错误。 如果您只是从每一行中删除选项卡，它将正常工作