将图像与表格中的文本对齐

Question

我正在尝试将图片与表格中的文字对齐，以使图片与文字的底部对齐。

我目前的代码是：

<table class="table table-striped">
    <thead>  
      <tr>  
        <th><h4><img src="image.png" />Title1</h4></th>  
        <th><h4><img src="image2.png" />Title2</h4></th>  
      </tr>  
    </thead>  
    <tbody>  
      <tr>  
        <td>Subtitle1</td>
        <td>Subtitle2</td>
      </tr>  
      <tr>  
        <td>Subtitle1</td>
        <td>Subtitle2</td>
      </tr>
    </tbody>
</table>

目前看起来像这样：

如何使图像与文本底部对齐？

Answer 1

也许会这样做......

<table class="table table-striped">
  <thead>  
    <tr>  
      <th><h4><img src="image.png" style="vertical-align: text-bottom;" />Title1</h4></th>  
      <th><h4><img src="image2.png" style="vertical-align: text-bottom;" />Title2</h4></th>  
    </tr>  
  </thead>  
  <tbody>  
    <tr>  
      <td>Subtitle1</td>
      <td>Subtitle2</td>
    </tr>  
    <tr>  
      <td>Subtitle1</td>
      <td>Subtitle2</td>
    </tr>
  </tbody>
</table>

它使用样式属性-VERTICAL-ALIGN并赋值TEXT-BOTTOM