Question

过去几周我一直在玩这个游戏，但现在我变得绝望了。我在default.aspx中有一个非常简单的GridView，它显示基于服务器的文件夹中的图像。

我在gridivew中显示它们，我把宽度和高度设置为300px;所以它创造了一个300 x 300像素的正方形。

但这会使图像裁剪为300x300像素，但我希望图片的原始尺寸为溢出：隐藏;

我试图通过css在图像字段上添加它，但没有发生任何事情。

<asp:GridView ID="GridView1" 
runat="server" 
AutoGenerateColumns="False"
ShowHeader="False"
>
<Columns>

    <asp:ImageField DataImageUrlField="value">
        <ControlStyle CssClass="test" Height="300px" Width="300px" />
        <HeaderStyle Width="300px" />
        <ItemStyle Height="300px" Width="300px" />
    </asp:ImageField>
</Columns>
</asp:GridView>

CSS

 .test{
        overflow:hidden;
    }

Answer 1

如何将img更改为div，并使用image作为背景：

<asp:GridView ID="GridView1" 
runat="server" 
AutoGenerateColumns="False"
ShowHeader="False"
>
<Columns>
    <asp:TemplateField>
    <ItemTemplate>
        <div style="background-image:url(<%# Eval("value") %>);width:300px;height:300px;background-repeat:no-repeat;"></div>
    </ItemTemplate>
    </asp:TemplateField>
</Columns>
</asp:GridView>

Gridview中的图像

1 个答案: