Question

我正在尝试在基于jQuerymobile的Android手机屏幕应用上显示背景图片。这是HTML

<!DOCTYPE html>
<html>
  <head>
    <title>Title</title>

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="stylesheet" href="css/jquerymobile.css" />
    <link rel="stylesheet" href="css/index.css" />

    <script src="js/jquery.js"></script>
    <script src="js/jquerymobile.js"></script>

  </head>
  <body>
    <div data-role="page" id="Main" class="main-page">
      <ul data-role="listview" data-filter-reveal="true" data-filter="true"
                data-filter-placeholder="Insert the city here..." data-inset="true">
        <li><a href="#LimonePiemonte">Limone Piemonte</a></li>
        <li><a href="#Artesina">Artesina</a></li>
        <li><a href="#Tonale">Tonale</a></li>
      </ul>
    </div>
    <!-- /page -->
  </body>
</html>

这是CSS（index.css）

.main-page {
    background:  transparent url(img/alpettalownologo.jpg) no-repeat center center;
    background-size: cover;
}

但我在背景中看不到任何图像。我错过了什么？

Answer 1

我猜你的url(img/alpettalownologo.jpg)不正确，因为这意味着它位于CSS文件的子目录中。

背景图片的位置需要与特定的CSS文件相关，因此根据您的文件结构，url(../img/alpettalownologo.jpg)可能会起作用。

android phonegap jquerymobile app中未显示的背景图片

1 个答案: