不良造型聚合物元件

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 ++中確認您的縮進是帶有制表符的，看起來就像是聚合物解析器中的錯誤。 如果您只是從每一行中刪除選項卡，它將正常工作