圖像按鈕在模擬器和PhoneGap的不工作 - 離子2

我在home.scss圖像按鈕在模擬器和PhoneGap的不工作 - 離子2

.img_button{ 
    color: #fff; 
    width: 200px; 
    height: 70px; 
    background: none; 
    box-shadow: 0px 0px 0px 0px; 
    background-image: url("/build/images/lotus_button.png"); 
    background-repeat: no-repeat; 
    background-size: 100%; 
    background-size: 200px auto; 
    padding: 0 0 0 3em; 
    background-color: transparent !important; 
}

在home.html的

<ion-content class="home" padding> 
    <button class="img_button">Image Custom Button</button> 
</ion-content>

它在瀏覽器工作正常這個類，但不在ionic emulate ios或phonegap serve。

然而，在home.scss的.img_button更改背景圖片的URL是這樣的：background-image: url("http://www.clker.com/cliparts/d/X/i/j/F/U/expences-button-png-hi.png");它的工作在所有ionic emulate ios，phonegap serve，並在瀏覽器中。

我不知道如何在scss中使用我的本地路徑作爲background-image。

請幫忙。謝謝。

來源

2016-06-30 Vicheanak

我終於管理把它從

background-image: url("/build/images/lotus_button.png");

工作通過改變背景圖像

background-image: url("../../build/images/lotus_button.png");

在其他情況下，如果你想使用圖片的路徑與IMG SRC使用此：

<img src="/build/images/lotus_button.png">

來源

2016-06-30 17:28:24 Vicheanak

可能是一堆東西，我會做的第一件事就是debug in Chrome或Safari並查看控制檯選項卡以查看是否有任何明確的錯誤。接下來看看網絡標籤。它可以是任何白名單問題，圖像不會包含在您的構建中。

來源

2016-06-30 16:29:34

圖像按鈕在模擬器和PhoneGap的不工作 - 離子2

回答

相關問題