c# - 如何在 Web 表单 C# 中并排添加网格视图？

<table> <tr> <td> <asp:GridView ID="GridView1" runat="server"> </asp:GridView> </td> <td> <asp:GridView ID="GridView2" runat="server"> </asp:GridView> </td> </tr> </table>

当我们刚开始时，我们经常尝试使用表格布局，然后将东西倒在里面。

不！！！

只需使用 div，将其向左浮动。把你的网格或控件或任何东西放在里面。

然后想把更多的东西放在右边吗？

放入另一个 div，向左浮动。

那么，如果我想要两个并排的网格？

然后是两个 div，向左浮动

你得到这个：

或者使用标记，你会得到：

然后说你想要一个组合框在两者的右边？

放入另一个 div，再次向左浮动。

要开始新行，请执行以下操作：

所以，让我们加载两个网格。

    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
            LoadGrid();
    }

    public void LoadGrid()
    {
        using (SqlCommand cmdSQL =
            new SqlCommand("SELECT ID, HotelName, City, Province FROM tblHotels ORDER BY HotelName",
            new SqlConnection(Properties.Settings.Default.TEST4)))
        {
            cmdSQL.Connection.Open();
            GridView1.DataSource = cmdSQL.ExecuteReader();
            GridView1.DataBind();
            cmdSQL.Connection.Close();

            cmdSQL.CommandText = ("SELECT * FROM People ORDER BY FirstName");
            cmdSQL.Connection.Open();
            GridView2.DataSource = cmdSQL.ExecuteReader();
            GridView2.DataBind();

        }
    }

输出：

真的很好吗？让我们为每个网格添加一个顶部标题。

我们现在有这个标记：

        <div style="float:left">
            <h2>Hotel List</h2>
            <asp:GridView ID="GridView1" runat="server" CssClass="table table-hover"></asp:GridView>
        </div>

        <div style="float:left;margin-left:25px">
            <h2>People Booked</h2>
            <asp:GridView ID="GridView2" runat="server" CssClass="table table-hover"  ></asp:GridView>
        </div>

现在的输出是

实际上，执行上述操作最终会得到一个“响应式”引导页面。

你可以为每个 div 添加一个“宽度”，如果你想要一些尺寸，你可以添加到网格中。

所以，请记住：

我不建议使用旧的“桌子”想法来排列东西。

放下一个 div，向左浮动。

现在，你想要一个组合框，另一个网格（根据 aobve）

放下一个 div，向左浮动。

开始新的生产线？div 清除：两者

因此，在 30 秒内，您可以排版别人需要 2 个月努力学习才能排版的页面。这个简单的技巧？我能够建立任何我需要的网站，我什至不知道网络开发。

c# - 如何在 Web 表单 C# 中并排添加网格视图？

问题描述

解决方案

推荐阅读