Question

我正在使用jquery mobile。我在css body {}标签内的索引页面中定义了一个背景图片。背景很好但它会自动加载到不同的页面，虽然我没有在后面的页面中声明正文css部分。怎么预防？和css body {background：url（）}仅适用于索引页面。这是我的代码

        <style type="text/css">
            body {
                background: url(images/login2.png);
                background-repeat:repeat-y;
                background-position:center;
                background-attachment:scroll;
                background-size:100% 100% ;
            }
            .ui-page {
                background: transparent;
            }
            .ui-content{
                background: transparent;
            }
            </style>

        </head>


<body>


        <div align="center" data-role="fieldcontain" id="contentConfirmation" name="contentConfirmation">


            <div >
                <label class="userlabelclass" for="url" style="float:left" ><p>Username:</p></label>
                <input class="userfieldclass" id="Lusername" name="uid_r" type="text" value="John Doe" " style="width:230px;float:right">
              </div>  


    <div >
                    <label class="pswdlebelclass" for="url" style="float:left"><p>Password:</p></label>
                    <input class="pswdfieldclass" id="Lpassword" name="pwd_r" type="password" value="123456789" style="width:230px;float:right">
                    <label class="forgotclass" for="url" style="float:left"><p>Forgot Password?</p></label>


    </div>


         <div align="center">
                <a href="listview_page.html" data-role="button" data-inline="true" data-theme="e" class="buttonclass" >Log In</a>
         </div>
   </div>

</body>

Answer 1

Jquery移动导航使用Ajax仅加载您导航到的页面的body部分。这意味着后续页面的header将被忽略，并且第一页的header将“应用”到所有页面。如果您希望您的背景仅适用于您的第一页，我建议：

您创建了一个data-role="page" div来保存第一页的内容，这是使用jquery mobile时的建议
您将背景应用于此特定页面元素

如何防止每页加载背景图片？

1 个答案: