Html 垂直将表格内的图像与底部对齐

一个典型的css对齐问题：

<table style="width:100px"> <!-- Not actually necessary; just makes the example text shorter -->
   <tr>
      <td style="padding:0;">
         <div style="height:100%; width:100%; background-color:#abc; position:relative;">           
            test of really long content that causes the height of the cell to increase dynamically
         </div>
      </td>
      <td>
           <div>text</div>
          <div ></div>
           <img style="vertical-align: bottom;" src="https://fbcdn-profile-a.akamaihd.net/hprofile-ak-prn2/1118727_100000298033362_1412277170_q.jpg"/>
      </td>      
   </tr>
</table>

测试导致单元格高度动态增加的非常长的内容
文本

如何使图像始终出现在表的底部，文本停留在中间？

---

谢谢

将valign设置为底部

<td valign="bottom">

---

希望这有帮助

您可以设置

垂直对齐

css属性：

#your_td {
 vertical-align: bottom;
}

---

参见此

基于您的示例，您可以使用定位来实现您想要的：

td {
    position:relative;
}
img {
    position:absolute;
    bottom:0;
}

---

图像前面单元格中的文本会发生什么变化？它也应该出现在底部，贴在图像的顶部吗？它最好是停留在整个东西的中间。对不起，我没说清楚。我编辑了我的问题。应该由css生成，而不是html5中不推荐或不再支持的属性