Light DOM樣式「泄漏」到聚合物組件的陰影DOM

我有一個聚合物Web組件，它在組件內部有一個名爲內容的div。Light DOM樣式「泄漏」到聚合物組件的陰影DOM

我注意到，如果主機頁面的樣式爲div.content，那麼它會將該樣式應用於我的組件！

這是一個意想不到的事件，因爲Web組件應該防止輕型DOM樣式泄漏到組件中。另外，我使用的是應該防止發生這樣的事情下面的CSS規則：

:host { 
    all: initial; 
}

任何想法？

能否請你加全要素的你如何使用它的代碼和HTML，並添加contentvto它：

如果要啓用默認的影子DOM，您可以使用此config這樣做？ –

默認聚合物不使用陰影。它使用了一個近似值，稱爲shady dom，它不提供樣式封裝，並且所有內容都被轉儲到光源 dom。

<script> 
    window.Polymer = window.Polymer || {}; 
    window.Polymer.dom = 'shadow'; 
</script>

2016-02-05 15:56:35 Abhinav

我剛剛也認識到了這一點。 –

我真的不明白爲什麼這不是默認設置。 –

Shadow DOM polyfill真的很重。在本機不支持的瀏覽器（除chrome之外的所有瀏覽器）上，您可以輕鬆地預計您的加載時間增加3倍。這就是爲什麼聚合物默認情況下聚合物可能會選擇加載精簡版polyfill，即webcomponents-lite.js。 – Abhinav

回答