Html 如何在 <td> 中垂直对齐图像
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2452280/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to vertically align images in <td>
提问by Ricky
I got a <td>where two images () reside shown as follows. One is much higher than the other. How do I let the shorter one align to the top of <td />?
我得到了<td>两个图像 () 所在的位置，如下所示。一个比另一个高得多。如何让较短的对齐到顶部<td />？
<td style="padding-left: 0px; cursor: pointer; vertical-align: top;">
<img width="85px" src=".../xyz.png"/>
<img src=".../icon_live.gif" /> // shorter one
</td>
回答by Shawn Steward
You need to set vertical alignment on the images themselves.
您需要在图像本身上设置垂直对齐。
<style>
td img {
vertical-align: top;
}
</style>
回答by heisthedon
add align="top"to the first image (the tall one)
添加align="top"到第一张图片（高大的图片）
<td style="padding-left: 0px; cursor: pointer; vertical-align: top;">
<img width="85px" src=".../xyz.png" align="top" />
<img src=".../icon_live.gif" /> // shorter one
</td>
回答by Siroj Matchanov
This did the job for me:
这为我完成了工作：
#logo-table td img, #logo-table td
{
vertical-align: middle;
}
In html:
在 HTML 中：
<table id="logo-table">
<!--table contents with imgs-->
</table>
回答by msw
If you give a class to your <img class="tops">then the CSS
如果你给你一个类，<img class="tops">那么 CSS
.tops {
vertical-align: top;
}
will bind the top edge of the images to the table cell top.
将图像的顶部边缘绑定到表格单元格顶部。
回答by ZX12R
try this..
尝试这个..
<td cellpadding="0" valign="top">
<img width="85" src=".../xyz.png" style="display:inline;"/>
<img src=".../icon_live.gif" style="display:inline;" />
</td>
