陰影DOM

Question

內部應用僞元素CSS選擇我有一個聚合物2 paper-input，其保持時間：

<paper-input type="date"></paper-input> 

當此呈現的實際<input>是影子DOM用於控制內部。

我想使用僞元素選擇器::-webkit-inner-spin-button來設置Chrome中的微調按鈕的樣式。

在Polymer 1/Shadow DOM v0中，我可以使用/deep/或::shadow爲這些創建樣式規則，但這些已在Polymer 2/Shadow DOM v1中棄用。

如何將樣式應用於<paper-input>的shadow DOM中的僞元素？

Answer 1

您可以使用--paper-input-container-input-webkit-spinner自定義CSS混合have a look at this。

舉例來說，隱藏微調：

paper-input[type=date] { 
    --paper-input-container-input-webkit-spinner: { 
     -webkit-appearance: none; 
    } 
}