工作燈CSS沒有找到圖片文件夾

在我的CSS我有一個背景圖像是這樣的：工作燈CSS沒有找到圖片文件夾

background-image:url("../images/klasExFoto.png") !important;

在仿真器和網頁瀏覽器它顯示的圖像。當我在Android設備上運行它時，它找不到該文件夾中的圖像。當我在HTML中設置圖像時，它工作正常。

<img src="images/klasExFoto.png" />

像這樣，它適用於瀏覽器和Android設備。

如果我設置沒有「../」的背景圖像，它在Android和webbrowser上都不起作用。

如何在Android上爲CSS背景圖像設置文件夾路徑？

我使用Worklight 6.0.0.1。

我的CSS：

#AddClassForm_Foto{ 
     width:140px; 
     height:140px; 
     background-image:url("../images/klasExFoto.png") !important; 
     border:doubles 1px #dedede; 
    } 
    .formItem{ 
     margin-top:16px; 
    }

我的HTML：

<div class="formItem"> 
    <label for="AddClassForm_Foto">Foto</label> 
    <div id="AddClassForm_Foto"></div> 
    </div>

我只看到了網頁瀏覽器的圖像，在Android中並不顯示出來。

來源

2013-10-22 Ken Vernaillen

在CSS背景圖像中將文件夾路徑設置爲'images/klasExFoto.png'。因爲它總是會將圖像僅搜索到「圖像」文件夾。 – GrIsHu

如果我這樣設置，它不適用於所有設備。 –

你在哪裏放置了'images'文件夾？ – GrIsHu

你沒有提及任何版本。

我有一個WL 6.0.0.1項目如下：

img { 

background-image:url("../images/icon.png") 
}

而且在Android 4.1.2和4.3運行Android環境。背景圖像顯示出來。

它或者是您正在使用的Worklight和Android版本的特定內容，或者是相對路徑以外的其他內容是問題。

來源

2013-10-22 13:35:03

我編輯了更多信息的問題。我使用WL 6.0.0.1並沒有看到圖像。爲什麼你在img元素上使用背景圖片？ @David –

我同意這可能不是WL特定的問題。我建議你通過傳遞一個CSS linter來驗證最終的CSS文件是否有語法錯誤（例如http://csslint.net/）。

作爲另一個測試，將該規則移動到CSS文件的最頂部，看看它是否有所作爲。不同的渲染器可能更容忍語法錯誤。

當CSS文件連接在一起時，請查看android/native/assets/www/default/css/MyCss.css文件中的最終CSS，以瞭解任何明顯的問題。

來源

2013-10-22 13:57:21

看起來像我的圖像有一個大寫的K和網頁瀏覽器不介意它，但Android做到了。

我用「../images/KlasExFoto.png」取代了「../images/klasExFoto.png」，現在一切都恢復正常了。

來源

2013-10-22 14:15:31

很好，你解決了這個問題;你能把這個標記爲已回答嗎？謝謝。 –

明天我可以標記;） –

工作燈CSS沒有找到圖片文件夾

回答

相關問題