如何更改dart的core-icon-button和paper-icon-button的大小？

有沒有一個簡單的css造型入門，比如減小核心圖標按鈕的尺寸？如何更改dart的core-icon-button和paper-icon-button的大小？

我正在用這些替換字體真棒圖標，目前圖標大小比文本大得多，所以我正在尋找縮小它的方法。

<div horizontal layout> 
    <core-icon-button icon="add-circle"></core-icon-button> 
    <div horizontal layout center>Expand Entries</div> 
    </div>

理想情況下，我想縮小圖標按鈕中的圖標，並減少填充爲好。

來源

2014-08-29 user1338952

你想要更小的圖標還是更小的按鈕？你現在使用哪個圖標集？ '這些'不是很具體;-) – 2014-08-29 16:37:31

它看起來像核心圖標按鈕包裝核心圖標。我正在使用核心圖標按鈕，但一般的解決方案/方法會很棒。上面的「添加圈子」只是我相信的一個核心。我看到一個類似的未解答的問題http://stackoverflow.com/questions/25352296/polymer-paper-menu-button-change-the-default-size-of-icon，看起來像一個很好的建議，但不確定如何做到這一點：「設置高度使用：陰影屬性在主要的CSS」。尋找CSS來堅持在模板中。 – user1338952 2014-08-29 16:44:10

這是我使用你的代碼時的樣子。

enter image description here

均可進行這種風格的元素含有<core-icon-button>

core-icon-button /deep/ core-icon[role=img] { 
    height: 12px; 
    width: 12px; 
    padding: 1px; 
    margin: 1px; 
    } 

    core-icon-button { 
    padding: 0 1px 1px 1px; 
    margin: 1px; 
    }

圖標變得非常小。我不得不添加[role=img]，否則選擇性很低纔會生效。

來源

2014-08-29 17:34:58

嗯。似乎沒有爲我工作。有了這個添加，圖標的svg中的viewBox仍然是24x24，而填充它仍然是37x37。在Dartium中運行時沒有效果。 – user1338952 2014-08-29 18:24:27

我沒有檢查其他細節，但圖標後來只是一個小點。您是否擁有最新的Poylmer 0.13.0和核心元素0.2.0 + 1版本？ – 2014-08-29 18:26:34

我不是，但只是升級，沒有變化 - 仍然很大。 – user1338952 2014-08-29 18:36:01

如何更改dart的core-icon-button和paper-icon-button的大小？

回答

相關問題