2012-10-15 31 views
0

我正在使用jQuery和jQuery的手機實現登錄頁面。無法適應手機屏幕使用jQuery的移動

的login.html

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="ISO-8859-1"> 
<title>Application</title> 
<link rel="stylesheet" type="text/css" href="css/jquery.mobile-1.1.1.css" /> 
<link rel="stylesheet" type="text/css" href="css/jquery.mobile.structure-1.1.1.css" /> 
<link rel="stylesheet" type="text/css" href="css/jquery.mobile.theme-1.1.1.css" /> 


<script type="text/javascript" src='js/jquery-1.8.2.js'></script>   
<script type="text/javascript" src="js/jquery.mobile-1.1.1.js"></script> 
<script type="text/javascript" src="js/login.js"></script> 

</head> 
<body> 
    <div data-role="page" id="home"> 

     <div data-role="header" data-theme="b">    
      <h1>Developers Code</h1> 
     </div> 

     <div data-role="content" id="contentConfirmation" name="contentConfirmation" align="center"> 
      <h1>Login Page</h1> 
      <h2></h2> 

      <form id="HLogin" method="POST"> 
       <div data-role="fieldcontain"> 
        <label for="url">Username:*</label> 
        <input class="required" id="Lusername" name="uid_r" value="" type="text">    
       </div> 

       <div data-role="fieldcontain"> 
        <label for="url">Password:*</label> 
        <input id="Lpassword" name="pwd_r" value="" type="password">    
       </div> 

       <div class="ui-grid-a"> 
        <div class="ui-body ui-body-b"> 
         <div class="ui-block-a"> 
          <button data-icon="delete" data-theme="c" type="submit">cancel</button> 
         </div> 
         <div class="ui-block-b"> 
          <button data-theme="b" type="submit">Login</button> 
         </div> 
        </div> 
       </div> 
      </form> 

     </div> 
    </div> 

</body> 
</html> 

這頁是不適合在屏幕上。我想在屏幕上顯示所有內容。

你能幫我解決這個問題嗎?

+0

你應該添加一個元視口標籤.. – defau1t

回答

0

您應該添加以下的<head>標籤中:

<meta name="viewport" content="width=device-width, initial-scale=1"> 

希望這有助於。讓我知道這個是否奏效。

相關問題