0

我的问题是关于 h:graphicImage 在 ah:panelGrid 中的显示

<h:panelGrid border="0" cellspacing="0" cellpadding="0" >
   <h:graphicImage height="63" width="270" value="images/NewAOnly.PNG" />
    <h:graphicImage height="60" width="270"        value="images/NewABottom.PNG" />
</h:panelGrid>

顶部的 .PNG 文件为 270 x 63,没有边框区域。底部 .PNG 为 270 x 60,没有边框区域。

我的问题是,对于border="0"、cellspacing="0" 和cellpadding="0",为什么这两个图像不是一个在另一个之上,它们之间没有空间?

4

1 回答 1

3

这将在您使用严格的 doctype时发生。长话短说,请查看 Mozilla 开发者网络上的文章:图像、表格和神秘差距。至于 doctype,您可以通过使用 quirks 或 transitional doctype 来解决此问题(作为快速测试,DOCTYPE完全删除该行)。然而,这几天不建议这样做。

如果您绝对肯定该表格是满足您以这种方式显示图像的具体功能要求的正确工具,例如 div 出于某种可疑的原因绝对不是一种选择(并且您完全了解“语义 HTML ”的重要性"),然后您可以通过使表格单元格中的图像块级元素来解决此问题。

td img {
    display: block;
} 

请注意,这个问题与 JSF 完全无关。JSF 在这个问题的上下文中仅仅是一个 HTML 代码生成器。

于 2013-05-11T00:06:12.873 回答