使图像与文本一样高

<div class="container">
  <img src="image.jpg" alt="图像">
  <p>文本内容</p>
</div>

<style>
.container {
  display: flex;
  align-items: center; /* 垂直居中对齐 */
}
</style>

<table>
  <tr>
    <td><img src="image.jpg" alt="图像"></td>
    <td><p>文本内容</p></td>
  </tr>
</table>

<style>
table {
  width: 100%;
  height: 100%;
  border-collapse: collapse;
}

td {
  height: 100%;
  vertical-align: middle; /* 垂直居中对齐 */
}
</style>

<div class="container">
  <img src="image.jpg" alt="图像">
  <p>文本内容</p>
</div>

<script>
window.addEventListener('load', function() {
  var image = document.querySelector('.container img');
  var text = document.querySelector('.container p');
  
  var maxHeight = Math.max(image.offsetHeight, text.offsetHeight);
  image.style.height = maxHeight + 'px';
  text.style.height = maxHeight + 'px';
});
</script>