聚合物 - 造型第三方（非聚合物）部件

Question

如何創建第三方（非聚合物）代碼的範圍造型？

我正在打包visjs時間線，但在我的聚合物包裝元素中創建樣式時間軸的樣式不起作用，因爲它們的範圍有限。我必須修改全局樣式。

有沒有辦法做本地造型？

Answer 1

在你的CSS中使用::content前綴，那麼你應該能夠逃避範圍，並做一個正常的CSS。

任何方式，如果這不起作用。你能提供代碼嗎？

Answer 2

我通常使用一種可能因爲CSS特性而可能出現的技巧。當你需要在某些元素上設置樣式並且不希望在任何地方重要時，它非常方便。在你的情況下，它也可以幫助。這裏是我發現時間線看起來像http://visjs.org/examples/timeline/styling/customCss.html基本上所有的造型都是在這個例子中。因此，我們有一些帶有ID

<div id="visualization"></div> 

這裏的div和它內部產生的所有時間表，它可以與常規的CSS定義樣式像

.vis-timeline { 
/* some properties goes here */ 
} 

.vis-item { 
/* some properties goes here */ 
} 
... 

但它也可以麪包車用少量設置樣式更具體一點選擇是這樣的：

#visualization .vis-timeline { 
/* some properties goes here */ 
} 

#visualization .vis-item { 
/* some properties goes here */ 
color: red; 
} 
... 
#second_visualization .vis-item { 
color: green; 
/* some properties goes here */ 
} 

然後只要你喜歡通過更改ID和添加另一個選擇可以讓儘可能多的不同風格的一頁。事實上，通過使用這種特殊性，您可以設計出許多Web組件 - 這是一種超越任何內置風格的超級簡單方法 - 只需在選擇器中添加更重要的內容即可。