-2

我的网页在设备上的浏览器上运行良好,但是当我保存到该网页的主屏幕并从中打开时,从桌面图标打开它时会退出一些屏幕尺寸问题。如何解决这个问题。

我的CSS代码如下

     *, body, div, h1, h2, h3, h4, h5, h6, p, ul, li, img, nav, header, section {
margin: 0; padding: 0; border: 0;
    }


   /* Styles */
     body {
     width:2048px;
     height:748px;
     background-color: #fff;
     overflow: hidden;
    font-family:Verdana, Geneva, sans-serif;
    }
    #container {
position:absolute;
width: 2048px; margin:0; 
overflow-x:hidden;
overflow-y:hidden;
padding: 0;
    }

   .panel{
background-image:url(image/testing_file_1.png);
background-repeat:no-repeat;
height:748px;
width:1024px;
position:relative;
float: left;
padding:0;
bottom:0;
top:0;
margin:0;
display:inline;
}
   .main_heading{
float:left;
margin:47px 0 0 60px;
font-size:24px;
font-weight:bold;
color:#FFF;
    }
    .main_heading_two{
float:left;
margin:47px 0 0 60px;
font-size:24px;
font-weight:bold;
color:#FFF;
    }
   .menu {
float:right;
margin: 39px 18px 0 0;
height:47px;
background-repeat:no-repeat;
    }

    .menu ul li {
list-style:none;
float:left;
    }

    .menu ul li a {
text-decoration:none;
display:block;
    }

    .menu .active {
text-decoration:none;
background-image:url();
    }

   .menu .stix {
width:2px;
font-size:0px;
background-image:url(image/seperator.gif);
background-repeat:no-repeat;
padding:0;
height:47px;
    }

    .midmenu {
list-style-type:none;
float:left;
height:62px;
width:61px;
margin: 248px 0 0 0;

    }
   .midmenu1 {
float:right;
list-style-type:none;
height:62px;
width:61px;
margin: 248px -500px 0 0px;
   }

   .rightclass img{
padding: 2px 20px;
float:right;
width:459px;
height:560px;
z-index:10;}
   .text_paragraph{
float:left;
width:450px;
color:#FFF;
margin-left:80px;
margin-top:-525px;
   }
   .text_paragraph_1{
float:left;
width:420px;
color:#FFF;
margin-left:80px;
margin-top:-464px;
    }
   .text_paragraph_1 ul{
float:left;
color:#FFF;
margin-left:40px;
margin-top:5px;
    }
   .text_paragraph_1 ul li{
margin-top:5px;
    }
    .text_paragraph_2{
float:left;
width:450px;
color:#FFF;
margin-left:80px;
margin-top:-285px;
   }
    .text_paragraph_2 ul{
float:left;
color:#FFF;
margin-left:40px;
margin-top:5px;
   }
   .text_paragraph_2 ul li{
margin-top:5px;
font-style:italic;
   }
   .text_paragraph_2 p{
float:left;
color:#FFF;
margin-top:5px;
   }
   .linkbutton{
margin:-70px 0 0 70px;
float:left;}
   small
   {
font-size:9px;
    }






   .rightclass_one img{
margin: 2px 21px;
float:right;
width:459px;
height:560px;
z-index:10;}
    .midmenu_1 {
list-style-type:none;
float:left;
height:62px;
width:61px;
margin: -45px 0 0 0;

    }
    .midmenu_2 {
float:right;
list-style-type:none;
height:62px;
width:61px;
margin: -45px -500px 0 0px;
    }
    .right_text{
float:right;
color:#000;
margin-right:-470px;
width:440px;
text-align:center;
margin-top:-270px;}
   .image_21{

   float:right;
    margin-right:-390px;
    margin-top:-190px;}

   .ratemeter{
float:right;
margin-right:-410px;
margin-top:20px;}
   .image_one{
  float:right;
  margin-right:-450px;
  margin-top:92px;
  z-index:5;
   }
 .image_two{
 float:right;
 margin-top:93px;
 margin-right:-254px;
 z-index:10;
  }
   .image_one_one{
 float:right;
 margin-top:95px;
 margin-right:-317px;
 z-index:10;
 }
 .image_two_two{
  float:right;
  margin-right:-452px;
  margin-top:92px;
  }
4

2 回答 2

1

尝试从您的网页中将其放在您的脑海中:

<meta name="apple-mobile-web-app-capable" content="yes" />
<meta content="minimum-scale=1.0, width=device-width, maximum-scale=1.0, user-scalable=no" name="viewport" />
于 2012-04-26T06:34:03.540 回答
0

好的...这完全清楚,为什么你有一个固定的高度......在你的身体里,你将高度设置为 748px ......这不是可变的。尝试这样的事情:

我在我的 webapp 中使用了它,它运行良好:

body {
    position: relative;
    margin: 0;
    -webkit-text-size-adjust: none;
    min-height: 416px;
    -webkit-touch-callout: none;
}

我试图编辑您的代码,但我不知道它是否适合您。请试一试:

 body {
     width:2048px;
     min-height:748px;
     background-color: #fff;
     overflow: hidden;
     font-family:Verdana, Geneva, sans-serif;

     -webkit-text-size-adjust: none;
     -webkit-touch-callout: none;
     margin: 0;
     position: relative;
    }
于 2012-04-26T06:58:04.153 回答