Polymer自定義元素中的外部樣式表

Question

我將第三方控件包裝在聚合物1.1自定義元素中。 該控件帶有一個CSS文件，我希望將其范圍擴展到我的自定義元素。 這樣做的推薦方法是什么？ 想到的一些可能的選擇是：

1. 在我的自定義元素中包含指向我的css文件的普通舊鏈接標記
2. 使用HTML導入。
3. 在Polymer 1.1中，有一個新的概念被稱為樣式模塊，它應該根據聚合物文檔取代外部的sylesheets： https ：//www.polymer-project.org/1.0/docs/devguide/styling.html是另一種方法在樣式模塊中指定外部樣式表？

我不知道上述任何方法是否適用於我的場景。

更新

我嘗試使用下面其中一個答案中建議的樣式模塊，但由於某種原因，樣式模塊中指定的第三方css文件未加載。 知道為什么嗎？

我的風格，module.html：

<dom-module id="my-style-module">
    <template>
        <link rel="import" href="http://url_of_third_party_css_file">
    </template>
</dom-module>

my-custom-element.html（示例）：

<!-- import the module  -->
<link rel="import" href="my-style-module.html">

<dom-module id="my-custom-element">
  <template>
    <!-- include the style module by name -->
    <style include="my-style-module"></style>
    <style>:host { display: block; }</style>
    <span>Hello</span>
  </template>      
</dom-module>

Answer 1

1.0已棄用的方式是https://www.polymer-project.org/1.0/docs/devguide/styling.html#external-stylesheets ，我在這里做了一個簡短的例子： http ： //polymerjs.newfivefour.com/post / 126638694607 / sharing-css-styles-across-elements基本上，您使用您提到的外部CSS文件並使用自定義導入。

但是現在，從1.1開始，有一種新方法，您可以將CSS放入組件中，並通過HTML導入包含該組件，然后在組件中包含樣式包含標記： https ： //blog.polymer-project.org/announcements /2015/08/13/1.1-release/看起來你應該使用這種方法，雖然被棄用的仍然可以根據他們的博客文章。