2

我正在使用 asp.net 网络表单来开发移动应用程序我的代码：

<%@ 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>

我在模拟器中的输出低于输出，但我希望我的页面缩小并适合移动显示。 在此处输入图像描述 我的网页输出是： 在此处输入图像描述

此输出应缩小并适合移动设备。我已使用视口标签来执行此操作，但没有得到所需的输出。请帮我完成这项任务。iquery mobile 对这样做有帮助吗？

4

1 回答 1

0

您可以使用多种组合，我建议以下一种，

1) 使用这个视口标签，<meta name="viewport" content = "width =device-width, initial-scale = 1.0, maximum-scale = 1.0, user-scalable = no"/> 2) 使用流体布局，twitter bootstrap 是一个很好的库

于 2013-05-29T13:24:29.487 回答