td valign="top" 不工作 - CSS 覆盖某处

Posted 2023-03-05

【中文标题】td valign="top" 不工作 - CSS 覆盖某处

【英文标题】：td valign="top" not working - CSS overriding somewhere

【发布时间】：2014-12-17 08:42:48

【问题描述】：

已答复！

我有一些 css 覆盖了我的表格，但我不知道如何找到它。我只需要我的表格中的图像位于表格的顶部。我使用代码：

<td valign="top"><img src="../../../images/site/orangeBanner.png"    class="imagePic"/></td>

但它不起作用并在中间生成橙色条的图像。它应该在顶部与“INSPIRE”相同的高度。

这里是我完整代码的链接：FULL CODE

谁能看到为什么我的 valign="top" 不起作用？ 有什么可以覆盖 css 的吗？

【问题讨论】：

valign 与 html5 不兼容（如果您正在使用），请使用 CSS vertical-align: top;

screen.css 有这条规则覆盖它table, th, td vertical-align: middle;

【参考方案1】：

您的 td 最初在 CSS 中指定了 vertical-align: middle。您可以通过在包含您的图像的<td> 标记内使用style="vertical-align: top;" 内联来覆盖它。这应该可以完美地工作：

<td valign="top" style="vertical-align: top;"><img src="../../../images/site/orangeBanner.png"    class="imagePic"/></td>

【讨论】：

砰！做到了。谢谢法赫德！ :)

P.S.什么 css 有垂直对齐：中间？我找不到它。 css链接是什么？

@papadebeau 这三个元素table, th, td具有vertical-align: middle;在line 21中指定的样式screen.css样式表。

@papadebeau 请将我的答案标记为正确答案，以便用户知道您的问题已得到解答。谢谢。

是的，我会的。我试过了，但它说我必须等 12 分钟。不知道为什么 Stack 会这样做，但请放心，我会尽快回答。 ：） 谢谢！这就是为什么我将答案放在顶部，直到我可以将其标记为正确为止。 :)

【参考方案2】：

此 CSS 规则将覆盖它：

table, th, td 
    vertical-align: middle;

将其更改为顶部或将另一个类添加到该特定的 td 标记。 您也可以按如下方式向该 td 添加样式标签：

style="vertical-align: top;"