图像按钮图像在各个div中

时间:2013-07-24 13:45:30

标签: asp.net vb.net

我希望ImageButton中的所有图片都显示在单独的div中

 <asp:UpdatePanel ID="UPEmail" runat="server" UpdateMode="Always">
                <ContentTemplate>
                    <asp:DataList  ID="dlImages" runat="server" RepeatColumns="3" CellPadding="25" CellSpacing="25">
                    <ItemTemplate>
                    <asp:Imagebutton class="afbeelding" ID="Image1" CommandName='<%# Bind("Naam") %>' ImageUrl='<%# Bind("image", "http://url/Thumbs/{0}") %>' runat="server" style="width:200px; height: 250px; border: 2px grey solid;"  /><br />
                    <asp:Label ID="Label1" runat="server" Text='<%# Bind("Naam") %>'></asp:Label>
                    </ItemTemplate>
                    <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
                    </asp:DataList>
                </ContentTemplate>
                <Triggers>
                <asp:AsyncPostBackTrigger ControlID="ddlType" EventName="SelectedIndexChanged" />
                <asp:AsyncPostBackTrigger ControlID="ddlCollection" EventName="SelectedIndexChanged" />
                <asp:AsyncPostBackTrigger ControlID="ddlMateriaal" EventName="SelectedIndexChanged" />
                </Triggers>
                </asp:UpdatePanel>

有办法吗?

2 个答案:

答案 0 :(得分:1)

您可以使用CSS style="display:block"

所以将代码更改为

<asp:Imagebutton class="afbeelding" ID="Image1" CommandName='<%# Bind("Naam") %>' ImageUrl='<%# Bind("image", "url/Thumbs/{0}") %>' runat="server" style="display:block;width:200px; height: 250px; border: 2px grey solid;"  />

了解更多http://www.w3schools.com/cssref/pr_class_display.asp

答案 1 :(得分:1)

根据正在更新的原始帖子进行更新...将其包装在div中。下面将在每个div上放置一个“imageWrapper”类名,并将唯一的“imageWrapper [Naam在这里]”作为ID。根据需要删除div的类/ id:

<asp:UpdatePanel ID="UPEmail" runat="server" UpdateMode="Always">
            <ContentTemplate>
                <asp:DataList  ID="DlImages" runat="server" RepeatColumns="3"
                    CellPadding="25" CellSpacing="25">
                <ItemTemplate>
                <div class="imageWrapper" id='<%# eval("Naam", "imageWrapper{0}") %>'>
                <asp:Imagebutton class="afbeelding" ID="Image1" CommandName='<%# Bind("Naam")%>'
                    ImageUrl = '<%# Bind("image", "http://url/{0}") %>' runat="server"
                    style="width:200px; height: 250px; border: 2px grey solid;z-index: 10;"  />
                    </div><br />
                    <asp:Label ID="Label1" runat="server" Text='<%# Bind("Naam") %>'></asp:Label>
 </ItemTemplate>
                <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
                </asp:DataList>
            </ContentTemplate>
            <Triggers>
            <asp:AsyncPostBackTrigger ControlID="ddlType" EventName="SelectedIndexChanged" />
            <asp:AsyncPostBackTrigger ControlID="ddlCollection"
                EventName="SelectedIndexChanged" />
            <asp:AsyncPostBackTrigger ControlID="ddlMateriaal"
                EventName="SelectedIndexChanged" />
            </Triggers>
            </asp:UpdatePanel>