简体   繁体   English

如何删除内容下方的空白

[英]How to remove white space below the content

I have a simple page 我有一个简单的页面

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">

    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.1/jquery.mobile-1.4.1.min.css" />
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.4.1/jquery.mobile-1.4.1.min.js"></script>
   .ui-page-theme-a {
  background-image: url(../../Resources/Bingo/WebBingo/En/Common/Images/bg.png);
  -moz-background-size-: cover;
  -o-background-size-: cover;
  -webkit-background-size-: cover;
  background-size-: cover;
}
</head>
<body >
    <div id="preloader" style='background-color: #FF5794; position: absolute; height: 100%; width: 100%; left: 0px; top: 0px;'> </div>
</body>

when I test it in safari on iPad the page can be scrolled and there is a white space below the page. 当我在iPad上的野生动物园中对其进行测试时,可以滚动页面,并且页面下方有空白。 How I can remove it? 我如何删除它? Removing the meta tags has no effect. 删除元标记无效。 I play with debug version of jquery.mobile-1.4.1 and this line seems to be related with 我玩的是jquery.mobile-1.4.1的调试版本,这行似乎与

base = fauxEle = $( "", { "href": fauxBase }).appendTo( "head" ); base = fauxEle = $(“,” {“ href”:fauxBase})。appendTo(“ head”);

in method 方法中

baseTagTest. baseTagTest。

I remove loader from jqm so the white space not came from there 我从jqm中删除了加载程序,所以空白不是从那里来的

在此处输入图片说明

[1http://i.stack.imgur.com/2Scaw.jpg"> [1http://i.stack.imgur.com/2Scaw.jpg“>

I don't want to use any kind of footer because my page use background and canvas. 我不想使用任何页脚,因为我的页面使用背景和画布。

How to remove the white line if I have an image as theme background 如果我有图像作为主题背景,如何删除白线

I'm assuming you are trying to to make the div overlap other content. 我假设您正在尝试使div与其他内容重叠。

Try setting the position property to fixed as shown: 尝试将position属性设置为fixed,如下所示:

<div id="preloader" style='background-color: #FF5794; position: fixed; height: 100%; width: 100%; left: 0px; top: 0px;'> </div>

This will make the position relative to the view port. 这将使位置相对于视口。 This means that when the user scrolls the div will follow the user and stay in the same place on the screen. 这意味着,当用户滚动时,div将跟随用户并停留在屏幕上的同一位置。

You can add css to your body tag, 您可以将CSS添加到您的body标签中,

<style>
  body{
    margin:0;
    padding:0;
  }
</style>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM