如何在phonegap中使用css添加背景图像

Question

我正在为phonegap中的移动设备制作一个标签.我想添加图像作为选项卡的背景.问题是它不会添加任何背景图像.这是我的目录结构

图像在此文件夹中

www/img/tabs.png

在下面的CSS中我使用的路径像这样的url(./ img/tabs.png)左上角没有重复; 这不起作用.这是我的CSS文件

www/stylesheet/css/frames/footer.css

这是我的所有页面

www/pages/home.html

这是我的CSS

footer {
    position: absolute;
    z-index: 2;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 48px;
    padding: 0;
    background: #535353; 
}

footer ul {
    margin: 0;
    padding: 0;
    list-style-type: none; 
}

footer ul li {
    float: left;
    padding: 5% 10.9%;
    background: url(./img/tabs.png) top left no-repeat; 
}

footer ul li a {
    width: 100%;
    height: 100%;
    color: #fff;
    text-decoration: none; 
}

footer ul li a .current {
    background: url(./img/tabs.png) bottom left no-repeat; 
}

这是我的HTML

<header>
    Header
</header>
<section id="wrapper">
    <div id="scroll-content">

    </div>
</section>
<footer>
    <ul>
        <li><a href="#">Home</a></li>
        <li><a href="#">Profile</a></li>
        <li><a href="#">Photo</a></li>
    </ul>
</footer>

Answer 1

你的形象url不好.

实际上,url您提供给图像路径的应该与CSS文件的位置相关.

所以,你需要使用:

url(../../../img/tabs.png)

代替:

url(./img/tabs.png)

试一试,如果有效,请告诉我