如何使图像在 html 表格中很好地对齐？答案

【问题标题】：How to make images align well in html table?如何使图像在 html 表格中很好地对齐？
【发布时间】：2013-11-17 08:12:33
【问题描述】：

问题是：书籍封面不适合表格单元格。我想让它看起来干净整洁。

我想在我的博客上添加最好的开发者书籍封面。但是，我很难将它们对齐。我对表格的第一行和第二行使用 ** 标签。不是第 ** 个。

我知道这个设计很糟糕。 给我更多关于如何改进整个表的 cmets。图像超出每个单元格的边界。

有没有一种特殊的工具可以制作更好的表格？

【问题讨论】：

如果您想查看原始问题 - 它在编码解决 blogspot com 上

标签： html css web tags

【解决方案1】：

有没有专门的工具可以制作更好的表格？

是的，它叫做 CSS。

可能会改善表格外观的示例 CSS 如下：

table {
    border-collapse: collapse;
    width: 500px; /* 500px is an example */
}
table td {
    text-align: center;
    padding: 0.5em;
    border: 1px solid gray;
}
table td img {
    max-width: 100px; /* divide 500 by the amount of books per row */
}

在http://jsfiddle.net/46zUZ/6/观看直播

开始学习 CSS 的好地方是http://htmldog.com/guides/css/

【讨论】：

太好了，感谢您展示明显的东西！但是自动工具如何使它全部与一个按钮对齐？
您需要一个自动工具来做一些非常具体的事情。我能想到的最接近的方法是使用 Dreamweaver 并执行一些“全选”和“居中对齐”，但我在 CSS 中所描述的内容仍然无法通过工具实现。