表格图片对齐问题答案

【问题标题】：Table pictures alignment issue表格图片对齐问题
【发布时间】：2013-04-15 05:09:57
【问题描述】：

我第一次在这里发帖，因为如果通常我能够在其他答案中找到解决我的代码问题的方法，这一次，无论我尝试什么，它都不起作用。

我正在做一个有两行的表格，第一行基本上是图片，链接一些 PDF 文档，下面有一个标题（第二行）。

问题是图片的大小不同（不能更改）。我希望它们在行的底部对齐，在分隔线之前有一个小的边距。

现在，它们是居中的（我猜默认情况下），这还不错，但不是我想要的。当它们居中时我遇到的第二个问题是，由于某种原因，该行的第一张图片总是比其他图片高一点。不知道为什么。

希望你能帮助我编写下面的代码（我假设它充满了错误，因为几个调用不起作用并且可能会被删除）。

<table width="780"; bgcolor="#e8e8e8" style="table-layout:fixed" VALIGN="top">

<tr>


<td style="word-wrap: break-word;"; ALIGN="CENTER">
<div align="center";>

<a href="PDF URL" target="_blank">
        <img src="URL" alt="ALT">
    </a>
</div>
</td>

<td>
<div align="center">
<a href="PDF URL" target="_blank">
       <img src="URL" alt="ALT">
    </a>
</div>
</td>

<td>
<div align="center">
<a href="PDF URL" target="_blank">
       <img src="URL" alt="ALT">
    </a>
</div>
</td>



</tr>
<tr>
<td><div align="center"><p style="font-size:11px"><a title="TITLE1" href="URL" target="_blank">TITLE1</p></a>
</div></td>
<td><div align="center"><p style="font-size:11px"><a title="TITLE2" href="URL" target="_blank">TITLE2</p></a>
</div></td>
<td><div align="center"><p style="font-size:11px"><a title="TITLE3" href="URL" target="_blank">TITLE3</p></a>
</div></td>
<td><div align="center"><p style="font-size:11px"><a title="TITLE4" href="URL" target="_blank">TITLE4</p></a>
</div></td>

{/tr}
{/table}

【问题讨论】：

这是什么 HTML？
我不确定你的意思。我在这件事上是一个完全的初学者，据我所知，我通过混合 html 和 css 的东西做错了（如果这句话有意义的话......）
HTML用<>括号，CSS用{}，需要多学习
哦，我把所有的“

标签： html css html-table alignment

【解决方案1】：

您应该首先在标题中包含一个 .css 文件调用，如下所示：

<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

然后你可以创建一个“mystyle.css”文件，以便为你的表格应用你想要的所有样式。

看看这个页面。 W3School - CSS

您有一些关于如何更改颜色、边距、背景图像等的示例。

编辑：

如果您想应用 .html 文件中的所有样式，请尝试查看此网页。 http://www.w3schools.com/tags/

你有所有的html标签，选择你想要的，看看属性可以使用。

【讨论】：

我已经修复了括号问题。 Flowen，问题是我不是管理员，无法添加或更改样式模板。我被 inpage 选项卡住了。不过，我会尝试使用 inpage CSS 样式标题。
感谢Flowen，它已经好多了，而且使用起来非常简单。我在 CSS 样式标题中添加了以下行，它已经做出了很大的改变： td { vertical-align: bottom }
我现在面临的最后一个问题是，由于某种原因，表格的第一张图片总是比该行的其余图片高一点。不知道为什么..
查看所有图像是否具有相同的高度和宽度，这可能是问题所在。您可以为所有图像设置相同的 width="100px" 和 height="100px" 以保持相同。如果有帮助请勾选最佳答案^^
如果第一个建议有效，但这个无效。我仍然有第一张图片在顶部移动了一点（比如在所有其他对齐的机器人线上方 15-20 像素）。无论如何，我已将您的答案打勾！