Question

我有一个带有两个动态列的Asp Gridview。一列将显示一组字符（描述），另一列将显示图像。我只想限制此描述网格行高度。

<div>
    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataSourceID="SqlDataSource1" EnableModelValidation="True"
                  AllowPaging="True" GridLines="None" onselectedindexchanged="GridView1_SelectedIndexChanged">
        <Columns>
            <asp:TemplateField>
                <ItemTemplate>
                    <asp:Label ID="Label_dynamicDes" runat="server" Text='<%#Bind("description") %>'></asp:Label> <br/>
                </ItemTemplate>
            </asp:TemplateField>
            <asp:ImageField DataImageUrlField="picpath" ControlStyle-Width='200px'>
                <ControlStyle Width="200px"></ControlStyle>
            </asp:ImageField>
        </Columns>
    </asp:GridView>

    <asp:SqlDataSource ID="SqlDataSource_dynamic" runat="server">
    </asp:SqlDataSource>

</div>

如何控制GridView行大小的高度？我无法在Code背后做到这一点。请帮我一些css函数来预定义动态行的大小？

Answer 1

您可以从后面或标记中的代码设置RowStyle和AlternatingRowStyle。有关详细信息，请参阅MSDN。

修改

您可以在标记中设置RowStyle-CssClass，如下所示：

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataSourceID="SqlDataSource1" EnableModelValidation="True" AllowPaging="True" GridLines="None" onselectedindexchanged="GridView1_SelectedIndexChanged" RowStyle-CssClass="my-table-row-style">

将其设置在后面的代码中，如下所示：

GridView1.RowStyle.CssClass = "my-table-row-style";

或者仅仅使用CSS这样做：

#GridView1 td { height: 90px; }

Answer 2

我假设您不希望行的高度大于图像的高度（假设为90px）。您可以在TemplateField中放置一个固定高度的div并设置高度

   <asp:TemplateField>
    <ItemTemplate>

       <div style="height:90px; overflow:auto">
        <asp:Label ID="Label_dynamicDes" runat="server" Text='<%#Bind("description") %>'></asp:Label>
       </div>

    </ItemTemplate>
   </asp:TemplateField>

当描述超过高度时，div会因overflow:auto而产生滚动条。您还可以overflow:scroll

ASP Gridview，预定义行高度大小

2 个答案: