并非所有版本设备都支持phonegap设计

时间:2012-06-29 11:18:30

标签: android jquery cordova

我已经开发了android phonegap中的应用程序。我有标题页脚和8 文本框。但是我得到了不同的设计在不同的模拟器中。它未正确安装在所有移动设备中。

请指导我。

<!DOCTYPE HTML>
<html>
  <head>
    <meta name="viewport" content="width=320; user-scalable=no" />
    <meta http-equiv="Content-type" content="text/html; charset=utf-8">
    <meta name="inmobi-site-verification" content="d7e348f871ce2cfa2baee7c23da4d1d8">
    <title>PhoneGap</title>
     <script type="text/javascript" charset="utf-8" src="../js/main.js"></script>
    <link rel="stylesheet" href="../js/master.css" type="text/css" media="screen" title="no title" charset="utf-8">
    <script src="../Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script>
    <script src="../Scripts/jquery-1.4.1.js" type="text/javascript"></script>


    <script type="text/javascript" charset="utf-8" src="../js/cordova-1.7.0.js"></script>
    <script type="text/javascript">
        </script>
     <style type="text/css">
     #footer {
    position:absolute;
 bottom:0;
    width:100%;

}
    ul.sidemenu
{
    padding:0;
    margin:0;
    list-style:none;
    font-size:2em;
    border-top:1px solid #000000;
    border-left:1px solid #000000;
    border-right:1px solid #000000;

    border-bottom:1px solid #000000;
    width:260px;
    border-radius:5px 5px 5px 5px;
    background-color:#FFFFFF;
    }
    .searchbox input {
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;

margin-top:0.2cm;

margin-left:1cm;
width:70%;
height: 32px;
float: left;
font-size:15pt;
padding: 2px;
border-top: 4px solid orange;
border-bottom: 4px solid orange;
border-left: 4px solid orange;

}
.sea input {
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
margin-top:0.2cm;

background-image: url(sea.PNG);
color: #fff;
font-weight: bold; 

width:10%; 
height: 43px;
border: 0;
float: left;
border-top: 4px solid orange;
border-bottom: 4px solid orange;
border-right: 4px solid orange;
}

    </style>
 </head>

 <body id="body">

    <div id="header" style="top;0;width:100%">
    <div style="height:10%;border-width:3px;border-height:6px;background-color:#00458D;" align="center">
    <h1>Header</h1>
    </div>
    </div>
 <br>   
    <table>
        <tr>
            <td></td>
            <td></td>


            <td><label style="font-size:12pt">Choose one of the following options to search our directory of causes</label></td>
            <td></td>
            <td></td>

        </tr>
    </table>

    <div align="center">
    <div class="searchbox"><input type="text" name="searchbox" id="searchbox" placeholder="Search"></div>
<div class="sea"><input name="search" type="button" id="btn"></div>
</div>
      <br/>
      <br/>
     <div align="center">
    <div class="searchbox"><input type="text" name="searchbox" id="searchbox" placeholder="Search"></div>
<div class="sea"><input name="search" type="button" id="btn"></div>
</div>
<br/>
<br/>
<div align="center">
    <div class="searchbox"><input type="text" name="searchbox" id="searchbox" placeholder="Search"></div>
<div class="sea"><input name="search" type="button" id="btn"></div>
</div>
<br/>
<br/>
<div align="center">
    <div class="searchbox"><input type="text" name="searchbox" id="searchbox" placeholder="Search"></div>
<div class="sea"><input name="search" type="button" id="btn"></div>
</div>
<br/>
<br/>
<div align="center">
    <div class="searchbox"><input type="text" name="searchbox" id="searchbox" placeholder="Search"></div>
<div class="sea"><input name="search" type="button" id="btn"></div>
</div>
      <br/>
      <br/>
     <div align="center">
    <div class="searchbox"><input type="text" name="searchbox" id="searchbox" placeholder="Search"></div>
<div class="sea"><input name="search" type="button" id="btn"></div>
</div>
<br/>
<br/>
<div align="center">
    <div class="searchbox"><input type="text" name="searchbox" id="searchbox" placeholder="Search"></div>
<div class="sea"><input name="search" type="button" id="btn"></div>
</div>
<br/>
<br/>
<div align="center">
    <div class="searchbox"><input type="text" name="searchbox" id="searchbox" placeholder="Search"></div>
<div class="sea"><input name="search" type="button" id="btn"></div>
</div>
     <div id="footer" >
        <div style="height:15%;border-width:3px;border-height:6px;background-color:#00458D;" align="center">
        <h3>Footer</h3> </div>
        </div>
 </body>
</html>

我在Droid模拟器中的设计

Droid Emulator

Galaxy Tab中的设计

Galaxy Emulator

Android 4.2中的设计

Android 4.2-Emulator

0 个答案:

没有答案