如何創建primefaces

我想創建一個新的圖標在我的p:commandButton使用自定義圖標，但我失敗了，我用這個梅索德如何創建primefaces

PrimeFaces: how can I make use of customized icons?

，但沒有工作對我來說。我會告訴你我的代碼：

CSS代碼：

.img-button-help { background-image: url('img/mag.ico') !important; }

JSF CODE：

<p:commandButton icon="img-button-help" value="test" />

結果： enter image description here 新的結果 - >

如何使用customed圖標Primefaces？

來源

2013-10-25 marouanoviche

看起來沒有找到圖像，因此沒有可顯示的圖標。使用安裝了Firebug的Chrome或Firefox，按F12並查看是否可以訪問資源部分中的此圖標。 –

我認爲該圖像已建立，但未顯示或改編爲p：commandbutton – marouanoviche

您確定圖像已找到？您是否驗證過可以從您的網站訪問？驗證它的一種方法是使用我在上面評論中解釋的方法。以下是Chrome的文檔：https://developers.google.com/chrome-developer-tools/docs/resources –

嗨，你可以嘗試添加background-position到你的CSS，因爲primefaces圖像是基於精靈和.img-button-help確實設置了一個位置。試試這個：

.img-button-help { 
    background-image: url('img/mag.ico') !important; 
    background-position: center !important; 
}

來源

2013-10-25 15:55:43 DaniP

did not work too我有一個空的地方，像我發佈的圖片。 – marouanoviche

嘗試在px中設置位置 – DaniP

我找到了解決這個問題的丹科inspriring我創建了一個小圖標，我把它作爲背景在左

<p:commandButton value="test" style=" padding-left: 15px;background-image: url('img/mag.ico') !important;background-repeat: no-repeat;background-position: left;" />

現在我把它與使用的圖標primefaces的圖標。

來源

2013-10-25 16:39:35 marouanoviche

更好地使用CSS樣式 –

如何創建primefaces

回答

相關問題