Html 当里面有图像时,HTML垂直对齐表格单元格的内容
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/13187366/
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
提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 03:40:11 来源:igfitidea点击:
HTML vertically align content of table cell when there's image inside
提问by John Smith
Is there any way to make text vertically be aligned text Hello World!
to middle of table cell without splitting into two cells?
有没有办法使文本垂直对齐Hello World!
到表格单元格的中间而不分成两个单元格?
<table border="1">
<tr>
<td valign="middle" style="vertical-align:middle;">
Hello World! <img src="https://www.google.com/images/srpr/logo3w.png" border="1" />
</td>
</tr>
</table>
回答by user1534664
You need to vertically align the image, not the td element.
您需要垂直对齐图像,而不是 td 元素。
回答by Eric T
Works in Chrome FF and IE7 ....
适用于 Chrome FF 和 IE7 ....
<style>
.mid {
vertical-align:middle
}
</style>
<table border="1">
<tr>
<td class="mid">
<img src="https://www.google.com/images/srpr/logo3w.png" class="mid" border="1" />Hello World!
</td>
</tr>
</table>