Joomla 3.x上的Material Design Lite按鈕

Question

我試圖將Material Design Lite（http://www.getmdl.io/）中的按鈕添加到Joomla 3.x站點。

我按照我的能力最好的方向，我得到的輸出沒有得到造型。

我試圖完整記錄我的這個頁面上的嘗試：http://www.cherokeecollisioncenter.com/sandbox

所有幫助是極大的讚賞。

Answer 1

造型看起來非常適合我......你究竟想要達到什麼樣的目標？你有模型嗎？你清除了你的緩存嗎？

如果您在移動設備上使用這些設置，並且希望它們懸浮在頁面上，則必須將CSS樣式位置屬性設置爲固定。 https://www.google.com/design/icons/

浮動主頁按鈕可能會是這個樣子：

<button class="mdl-button mdl-js-button mdl-button--fab mdl-js-ripple-effect mdl-button--colored" style="position:fixed; right:10px; bottom:10px;"><i class="material-icons">home</i> </button> 

Answer 2

這裏是正確的答案，您可以通過材料圖標的頁面上的任何圖標的名稱替換「添加」更改圖標對於需要幾個常見的本地業務的移動動作的按鈕：

**<p style="text-align: center;"><button class="mdl-button mdl-js-button mdl-button--fab mdl-js-ripple-effect mdl-button--colored" onclick="location.href='tel:1234567890'"><i class="material-icons">call</i> </button><button class="mdl-button mdl-js-button mdl-button--fab mdl-js-ripple-effect mdl-button--colored" style="margin-left: 10%; margin-right: 10%;" onclick="location.href='//www.google.com/maps/dir//remaining-portion-of-link-to-directions'"><i class="material-icons">directions</i> </button><button class="mdl-button mdl-js-button mdl-button--fab mdl-js-ripple-effect mdl-button--colored" onclick="location.href='mailto:info@example.com'"><i class="material-icons">mail</i> </button> 
</p>** 

您還必須包括兩個CSS樣式表，並在每個頁面的頭部JS腳本文件。在我的情況下，託管的CSS覆蓋了一些我的網站設置，我不得不再次覆蓋它們。