带css的省道聚合物造型阴影根元素

我试图用css设计聚合元素的根元素。以计数器单击为例。如果我在主html中有一个聚合元素，我想给它一个大小（比如宽度和高度），我会尝试在主html中使用全局css，比如

click-counter{
width:100px;
height:100px;
}

这不管用

我也试着在聚合物元素里面做一些样式，比如

<polymer-element name="click-counter" attributes="count">
  <template>
    <style>
      @host{
        click-counter {
          width:100px;
          height:100px;
        }
      }
      ...

@主人{
点击计数器{
宽度：100px；
高度：100px；
}
}
...

这也不行。有人知道我将如何用css设计元素的样式吗？ （我使用的是dart 0.8.1.2）

谢谢，

---

Yi

点击计数器由按钮和文本输入组成。没有一个div可以将这两个元素结合在一起。因此，如果您要设置组件的宽度和高度，那么您真正要设置的是什么

<polymer-element name="click-counter">
  <template>
    <button on-click="increment">Click Me</button>
    <p>You clicked the button {{count}} times.</p>
  </template>
  <script type="application/dart" src="click_counter.dart"></script>
</polymer-element>

---

但这会影响页面上的所有div。我不确定如何在click counter组件中只选择根div。

这就是您想要做的吗

@CustomTag('click-counter')
class ClickCounterElement extends PolymerElement with ObservableMixin {
  @observable int count = 0;

  get applyAuthorStyles => true;

  void increment(Event e, var detail, Node target) {
    count += 1;
  }
}

  @host {
    :scope {
       ...
    }
  }

---

请参阅本教程的这一部分：

您需要使用“应用作者样式”属性，我想，[1]指的是[1]：我也尝试了该属性，但它也不起作用。

  @host {
    :scope {
       ...
    }
  }