<td>中的img上下垂直居中代码

最新推荐文章于 2024-04-25 13:27:51 发布

原创最新推荐文章于 2024-04-25 13:27:51 发布 · 9.7k 阅读

0 ·

CC 4.0 BY-SA版权

html 专栏收录该内容

5 篇文章

订阅专栏

本文介绍了一个关于HTML表格布局的问题案例，指出在表格中实现图片垂直居中时，正确的做法是将vertical-align:middle;属性应用在<td>元素上而非<img>元素上，并给出了具体的代码示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<table class="table table-striped shoptable1">
				  <tbody>
				    <tr>
				      <td rowspan="5" class="tableimg" style="text-align: center;vertical-align:middle;"><img src="static/image/shopimage/jiaya1.png" style="width:60px; height:90px;" id="shopimg1"></td>
				      <td colspan="2">预付款:<span style="color:red;">1999元</span></td>
				    </tr>
				    <tr>
				      <td colspan="2">价格:<span style="color:red;">3999元</span></td>
				    </tr>
				    <tr>
				      <td colspan="2">医院名称:张三门诊</td>
				    </tr>
				     <tr>
				      <td colspan="2">医院地址:上海市闵行区七宝地铁站吴宝路</td>
				    </tr>
				     <tr>
				      <td colspan="2">医院名称:张三门诊</td>
				    </tr>
				  </tbody>
				</table>

其中vertical-align:middle;应该加在<td>css样式里面，而不是<img>css样式里面，好多博客把vertical-align:middle;写到<img>中了，真想上去给他们一砖