0

如果我将以下元标记添加到我的移动网页,则垂直方向的块级元素之间会有额外的空间。

<meta name="viewport" content="initial-scale=1.2,user-scalable=no" id="metaViewwport">

如何解决问题?

完整代码:

 <html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="initial-scale=1.2,user-scalable=no" id="metaViewwport">
    <title>test</title>
    <style type="text/css">
        html,body
        {width:100%;height: 100%;margin:0px;padding:0px;}

        .slide-container
        {height:200px;width:100%;background-color:black;color:white;
        box-sizing:border-box;
        box-shadow:none;
        border:0px;
        padding:0px;
        margin:0px;
        }
    </style>
 </head>
<body>
<article style="height:100%;width:100%;">
    <section class="slide-container" style="">
        1
    </section>
    <section class="slide-container">2</section>
    <section class="slide-container">
       3
    </section>
    <section class="slide-container">
       4
    </section>

</article>

</body>
</html>
4

2 回答 2

0

您的问题很可能是您的视口。它设置为 1.2,而不是 1。

改为添加此行

<meta name="viewport" content="width=device-width, initial-scale=1">
于 2015-08-04T17:19:41.347 回答
-1

我通过将 height=device-height 添加到元视口来修复。就像:

<meta name="viewport" content="initial-scale=1.171875,height=device-height,width=320px, user-scalable=no">
于 2015-08-05T06:47:02.780 回答