如何清除windows手机电话空间的底部空间? [英] how to remove bottom space in windows phone phonegap?

查看:118
本文介绍了如何清除windows手机电话空间的底部空间?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在开发一个windows phone phonegap应用程序,一些空间发生在我的第一个div下很多解决方案来过来这个。但我没有得到任何解决方案。
如果有任何解决方法,请帮助我。

I am developing a windows phone phonegap application, some space occurs under my first div itried lot of solution to over come this. but i did not get any solution. if u have any solution means please help me.

<body onload="init()">
    <div id="content">

        <div class="title" align="center">
            <span class="left">
                    </span>
            <span class="center">
                <img src="images/title.png">
                    </span>
            <span class="right">
                <a href="home.html" onclick="location.replace(this.href); return false;">
                    <img src="images/home.png"/>
                </a>
            </span>
        </div>


        <div id="rapper">
            <div id="scroller2">
                <ul>
                    <li id="ln" onclick="change_click(this.id)"><div style="height:100%; width:100%;" > LN</div></li>
                    <li id="hn" onclick="change_click(this.id)"><div style="height:100%; width:100%;"> HN </div></li>
                    <li id="kn" onclick="change_click(this.id)"><div style="height:100%; width:100%;"> KN</div></li>
                    <li id="nn" onclick="change_click(this.id)"><div style="height:100%; width:100%;"> NN</div></li>
                    <li id="wn" onclick="change_click(this.id)"><div style="height:100%; width:100%;"> WN </div></li>
                    <li id="gn" onclick="change_click(this.id)"><div style="height:100%; width:100%;"> GN</div></li>

                </ul>
            </div>
        </div>

        <div height="80%">
            <div id="wrapper">
                <div id="scroller">
                    <ul id="listcontent">
                    </ul>
                </div>
            </div>
        </div>

        <div id="raper">
            <div id="scroller3">
                <ul id="pages">

                </ul>
            </div>
        </div>

        <div id="previouspage" style="text-align: center;"  onclick="pagination(-1)">
            <img height="100%" src="images/previous.png"/>
        </div>

        <div id="nextpage" style="text-align: center;"  onclick="pagination(1)">
            <img height="100%" src="images/next.png"/>
        </div>

    </div>

</body>

我的css代码

        * 
            {
                -webkit-tap-highlight-color: rgba(0, 0, 0, 0);  
                -webkit-box-sizing: border-box;
                -moz-box-sizing: border-box;
                box-sizing: border-box;
            }

            a
            {
                 text-decoration: none;
            }

            html, body
            {
                margin: 0;
                padding: 0;
                border: 0;
                outline: 0;
                width:100%;
                height:100%;
                overflow: hidden;
                text-decoration: none;
                font-family:arial;
            }


        /*panel*/

            #content 
            {
                height:100%;
                width:100%;

            }


        /*title*/

            .title
            {
                height:8.75%;
                border-bottom-color: #000;
                border-bottom-style: solid;
                border-bottom-width: 1%;

            }

            .title img
            {
                height:98%;            
            }

            .title .center
            {
                height:100%;    
                width:50%;  
                float: left;       

            }

            .title .right
            {
                height:100%;    
                width:25%;  
                float: left;    
                margin:0 auto;
                overflow:hidden;       

            }

            .title .left
            {
                height:100%;
                width:25%;  
                float: left;    
                margin:0 auto;
                overflow:hidden;       

            }

        /*body*/

            #inner
            {
                height:80%;
                width: 100%;
                float: left;       

            }

            #header
            {
                height:12%;
                color:#000000;
                width: 100%;
                text-align:center;     

            }

            #head
            {
                height:6%;
                color:#000000;
                width: 100%;        
                padding-top:2%;
                text-align:center;     

            }

            #heading
            {
                width: 100%;
                font-family: arial;  
                background: #f00; 
                color:#ffffff; 
                text-align: center; 
                align:center;      

            }



        /*tiles*/

            .vcard img
            {
                margin-left:10%;
                margin-right:10%;
                width: 80%; 
                height:auto;
                display:block;
                background-repeat:no-repeat;
                background-size:100%;
                background-color:transparent;
                border:none;
                image-rendering: -webkit-optimize-contrast;    

            }

            .vcard
            {
                width: 33%;
                height:auto;
                float: left;        
                overflow:auto;     

            }

            .card
            {
                width: 33%;
                height:33%;
                float: left;        
                overflow:auto;     

            }

            .space
            {
                height: 10%;
                text-align:center;     

            } 

            .primary
            {
                height: 20%;    
                width:100%;    

            } 


        /*scroller*/

            #wrapper
            {
                position: absolute;
                z-index: 1;
                top: 14%;
                bottom: 4%;
                left: 0;
                right: 0;
                width: 100%;
                overflow: hidden;

            }

            #Wraper
            {
                position: absolute;
                z-index: 0;
                top: 39%;
                bottom: 0PX;
                left: 0;
                right: 0;
                width: 100%;
                overflow: hidden;

            }

            #scroller 
            {
                position: absolute;
                z-index: 1;
                -webkit-tap-highlight-color: rgba(0,0,0,0);
                width: 100%;
                -webkit-transform: translateZ(0);
                -moz-transform: translateZ(0);
                -ms-transform: translateZ(0);
                -o-transform: translateZ(0);
                transform: translateZ(0);
                -webkit-touch-callout: none;
                -webkit-user-select: none;
                -moz-user-select: none;
                -ms-user-select: none;
                user-select: none;
                -webkit-text-size-adjust: none;
                -moz-text-size-adjust: none;
                -ms-text-size-adjust: none;
                -o-text-size-adjust: none;
                text-size-adjust: none;
                height: auto;

            }

            #loadmore
            {
                background:#ff0000;
                color:#ffffff;
                text-align:center;

            }

            #rapper 
            {
                position: absolute;
                z-index: 1;
                top: 8.75%;
                bottom: 87%;
                left: 0;
                width: 100%;
                background: #000;
                overflow: hidden;
                font-family: arial; 
                border-bottom-color: #000;
                border-bottom-style: solid;
                border-bottom-width: 1%;

            }

            #scroller2 
            {
                position: absolute;
                font-family: arial;  
                z-index: 1;
                width: 188%;
                height: 100%;
                background-color: #a00;
                -webkit-transform: translateZ(0);
                -moz-transform: translateZ(0);
                -ms-transform: translateZ(0);
                -o-transform: translateZ(0);
                transform: translateZ(0);
                -webkit-touch-callout: none;
                -webkit-user-select: none;
                -moz-user-select: none;
                -ms-user-select: none;
                user-select: none;
                -webkit-text-size-adjust: none;
                -moz-text-size-adjust: none;
                -ms-text-size-adjust: none;
                -o-text-size-adjust: none;
                text-size-adjust: none;

            }

            #scroller ul 
            {
                list-style: none;
                padding: 0;
                margin: 0;
                width: auto;
                height: 100%;

            }


            #scroller2 ul 
            {
                list-style: none;
                padding: 0;
                margin: 0;
                width: auto;
                height: 100%;
                background-color: #000000;
                text-align: center;

            }

            #scroller2 li 
            {
                display: block;
                float: left;
                width: auto;
                padding:0% 3px 0% 3px;
                height: 100%;
                background-color: #000000;
                color:#ffffff;
                border:2px solid #000000;
                border-radius:5px;

            }


            #scroller3 
            {
                position: absolute;
                z-index: 1;
                width: 188%;
                height: 100%;
                background-color: #da1e15;
                -webkit-transform: translateZ(0);
                -moz-transform: translateZ(0);
                -ms-transform: translateZ(0);
                -o-transform: translateZ(0);
                transform: translateZ(0);
                -webkit-touch-callout: none;
                -webkit-user-select: none;
                -moz-user-select: none;
                -ms-user-select: none;
                user-select: none;
                -webkit-text-size-adjust: none;
                -moz-text-size-adjust: none;
                -ms-text-size-adjust: none;
                -o-text-size-adjust: none;
                text-size-adjust: none;

            }

            #scroller3 ul 
            {
                list-style: none;
                padding: 0; 
                margin: 0;
                width: auto;
                height: 100%;
                text-align: center;

            }

            #raper 
            {
                position: absolute;
                z-index: 1;
                top: 96%;
                bottom: 0%;
                left: 20%;
                width: 60%;
                background: #da1e15;
                overflow: hidden;
                visibility:hidden;
            }


            #previouspage
            {
                position: absolute;
                z-index: 1;
                top: 96%;
                bottom: 0%;
                left: 0%;
                width: 20%;
                background: #da1e15;
                border:2px solid #000000;
                visibility:hidden;
            }

            #nextpage
            {
                position: absolute;
                z-index: 1;
                top: 96%;
                bottom: 0%;
                left: 80%;
                width: 20%;
                background: #da1e15;
                border-bottom-color: #000;
                border-bottom-style: solid;
                border:2px solid #000000;
                visibility:hidden;
            }

黑色部分提及空格

推荐答案

在MainPage.xaml更改

In MainPage.xaml change

shell:SystemTray.IsVisible="True"

shell:SystemTray.IsVisible="False"

这篇关于如何清除windows手机电话空间的底部空间?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆