dart - 如何创建继承父文档CSS的Polymer Dart组件？

Question

假设我有一个聚合物组件，目的只是包装一些样板HTML；

<link rel="import" href="/packages/polymer/polymer.html"> 

<polymer-element name="form-group" noscript>
  <template>
    <div class="row form-group">
      <div class="col-xs-3">Blah</div>
      <div class="col-xs-6">
        <content></content>
      </div>
    </div>
  </template>
</polymer-element>

这将按预期方式呈现HTML，但是CSS类无法正常工作，因为Shadow DOM与主要项目CSS隔离。我相信可以在此处重新导入CSS；但是据我所读，Shadow DOM似乎对此有些矫kill过正，所以我想避免这种情况。

我在GitHub上找到了 Allow creating polymer-elements without Shadow DOM，但是它已经关闭，而且解析度似乎仅适用于polyfills。

我还发现了一些建议，我可以删除 <template>标记，但这也不起作用(页面上什么都没有呈现，也没有错误!)。

我知道 applyAuthorStyles，但是它已被删除，我真的找不到任何关于原因或打算替代的信息。

Answer 1

我看到两种可能的解决方案:

使用穿过ShadowDOM的选择器

* /deep/ .row.form-group

创建一个外部CSS文件，并将其链接到要应用

的每个模板。

有一种在轻型DOM中创建元素的方法，但是它受到限制，而且我很久没看到它了(我自己也从未使用过它)。

更多详情可在这找到:

https://www.polymer-project.org/docs/polymer/styling.html

https://www.polymer-project.org/articles/styling-elements.html