モバイルアプリケーションのマイコードを開発するためにasp.net Webフォームを使用しています:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="MobileApplication.Default" %>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title>Mobile WebForms</title>
<meta charset="urf-8" />
<meta name="viewport" content="width=device-width" />
<style type="text/css">
body
{
font-family:Verdana;
height: 119px;
}
label
{
font-size:11pt;
font-family: Arial, Helvetica, sans-serif;
display:block;
margin-right:50px;
}
input[type=text]
{
width:200px;
height:15px;
margin-left:15px
}
.content
{
width:350px;
margin:0px auto;
}
header
{
width:350px;
text-align:center;
font-size:15px;
font-weight:bold;
}
.button
{
width:350px;
text-align:center;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div data-role="content">
<asp:Table ID="Table1" runat="server" GridLines="Both" Height="107px" Width="210px">
<asp:TableRow runat="server">
<asp:TableCell runat="server">
<asp:Label ID="Label1" runat="server" Text="Request ID"></asp:Label>
<asp:TextBox ID="TextBox1" runat="server" Text="9015/DOM/NDA/0711"></asp:TextBox>
</asp:TableCell>
<asp:TableCell runat="server">
<asp:Label ID="Label2" runat="server" Text="Request Type" ></asp:Label>
<asp:TextBox ID="TextBox2" runat="server" Text="Domestic Travel - Self (Employee)"></asp:TextBox>
</asp:TableCell>
</asp:TableRow>
<asp:TableRow runat="server">
<asp:TableCell runat="server">
<asp:Label ID="Label3" runat="server" Text="Request Status"></asp:Label>
<asp:TextBox ID="TextBox3" runat="server" Text="Pending With L1 Manager"></asp:TextBox>
</asp:TableCell>
<asp:TableCell runat="server">
<asp:Label ID="Label4" runat="server" Text="Label"></asp:Label>
<asp:TextBox ID="TextBox4" runat="server"></asp:TextBox>
</asp:TableCell>
</asp:TableRow>
</asp:Table>
</div>
</form>
</body>
</html>
エミュレーターの出力を下回っていますが、ページを縮小してモバイルディスプレイに合わせたいです。
私のWebページの出力は次のとおりです。
この出力は縮小してモバイルに収まるはずです。これを行うためにビューポート タグを使用しましたが、目的の出力が得られません。この仕事を手伝ってください。iquery mobile はこれを行うのに役立ちますか?