如何在一次普通的CSS样式应用到许多阴影根源是什么？

Question

想想，我有暗影使用DOM来隐藏自己的内部DIV汤和布局几个要素。

即使是艰难的，他们是不同的，它们共享相同的CSS样式表，因为它们使用的是同一套，都应该以一致的方式被造型元素。这可以，例如，一个CSS框架（引导）。

问题是，这个样式表是相当大的。

什么是有许多阴影罗茨之间这么大的样式表（在SD V1）的最有效方法是什么？

Answer 1

更新：2019 - 使用施工的样式表

截至2019年，施工的样式表是应用样式表影子DOM和网络组件的总体做法。阅读更多about it here。

以前的答案：

你可以在影子DOM定义的import元素的第一行使用<style> CSS规则：

<div id=D1></div>
<template id=T1>
   <style>
      @import url( '/css/stylesheet.css' )
   </style>
   ...
</template>

然后导入的影子DOM根<template> content：

var root = D1.attachShadow( {mode: open } )
root.appendChild( T1.content.cloneNode( true ) )