聚合物：不同風格的不同核心圖標按鈕

Question

我想添加兩個核心圖標按鈕（定製）後卡聚合物組件的右上角，另一個在底部中心。我該怎麼做呢？當前的代碼適用於核心圖標按鈕（如下）。有沒有辦法通過圖標類型限定core-icon-button的樣式？

<template> 
    <style> 
.... 
    core-icon-button { 
     content: '.icon clear'; 
     position: absolute; 
     top: 3px; 
     right: 3px; 
     color: blue; 
    } 
.... 
</style> 


<core-icon-button icon="clear"></core-icon-button> 
<core-icon-button icon="thumb-up"></core-icon-button> 
</template> 

Answer 1

您可以自由使用標準的衆所周知的HTML元素的IDS爲/類：

<template> 
    <style> 
    .clearbtn { color: white } 
    #thumbupbtn { left: 100px } 
    </style> 

    <core-icon-button class="clearbtn" icon="clear"></core-icon-button> 
    <core-icon-button id="thumpupbtn" icon="thumb-up"></core-icon-button> 
</template> 

爲

你還不如用CSS選擇器：

<style> 
    core-icon-button[icon="clear"] { color: white } 
    core-icon-button[icon="thumb-up"] { left: 100px } 
</style> 

希望它有助於。