Asp.net 将图像与div底部对齐

Asp.net 将图像与div底部对齐,asp.net,html,Asp.net,Html,我在配电盘中有一个div。我给这个添加了一个图像 我想将图像与DIV容器的底部对齐(以一行显示图像) 不要依赖asp ImageAlign属性。使用CSS,例如: <div style="float: right; width: 180px; height: 177px; margin: 0 30px 10px 5px; position:relative"> <div id="panel" <label>Name</label&g

我在配电盘中有一个div。我给这个添加了一个图像

我想将图像与DIV容器的底部对齐(以一行显示图像)




不要依赖asp ImageAlign属性。使用CSS,例如:

<div style="float: right; width: 180px; height: 177px; margin: 0 30px 10px 5px; position:relative">
   <div id="panel"
        <label>Name</label>
        <img id="Image1" src='img-url-goes-here' style="position:absolute;bottom:0px;height:40px;display:block;" />
    </div>
</div>​

在图像div中使用
垂直对齐:底部

<asp:Repeater ID="product" runat="server">
       <ItemTemplate>
          <div style="float: right; width: 180px; height: 177px; margin: 0 30PX 10px 5px">
             <asp:Panel ID="Panel1" runat="server">
                <font color="white">
                <asp:Label ID="Label1" runat="server" Text='<%# Eval("Name") %>'></asp:Label></font>
                <br />
                <div style="height:140px ; overflow:hidden; vertical-align:bottom">
                   <asp:Image ID="Image1"  runat="server"  Width="120px" ImageUrl='<%#  Eval("Image") %>' ImageAlign="Bottom" />
               </div>
            </asp:Panel>
         </div>
      </ItemTemplate>
    </asp:Repeater>



请清除您的要求,您希望在div下方或div内部设置图像到底部。我希望在div底部设置图像?字体元素已弃用。。。HTML5中不支持。使用CSS!谢谢,我用这个,但不显示div的图像底部。它是show top of div:(谢谢,但id上没有设置图像的高度…我用这个代码,但我的图像设置了主div的底部,并在标签上显示图像。谢谢,我用了,但不起作用..设置中继器的div底部,但图像是div的顶部:(@NilooRg我想我明白你的意思了。查看最新编辑。
<div style="float: right; width: 180px; height: 177px; margin: 0 30px 10px 5px;">
    <asp:Panel ID="Panel1" runat="server">
        <font color="white">
            <asp:Label ID="Label1" runat="server" Text='<%# Eval("Name") %>'></asp:Label>    
        </font>
        <div style="overflow:hidden;height:140px; position:relative;">
            <asp:Image ID="Image1"  runat="server"  Width="120px" ImageUrl='<%# Eval("Image") %>' style="position:absolute; bottom:0px; height:40px; display:block;" />
        </div>
    </asp:Panel>
</div>
<asp:Repeater ID="product" runat="server">
       <ItemTemplate>
          <div style="float: right; width: 180px; height: 177px; margin: 0 30PX 10px 5px">
             <asp:Panel ID="Panel1" runat="server">
                <font color="white">
                <asp:Label ID="Label1" runat="server" Text='<%# Eval("Name") %>'></asp:Label></font>
                <br />
                <div style="height:140px ; overflow:hidden; vertical-align:bottom">
                   <asp:Image ID="Image1"  runat="server"  Width="120px" ImageUrl='<%#  Eval("Image") %>' ImageAlign="Bottom" />
               </div>
            </asp:Panel>
         </div>
      </ItemTemplate>
    </asp:Repeater>