代码之家 › 专栏 › 技术社区 › Prabhat

如何在JSF中设置h:panelgrid高度?

jsf css html

Prabhat · 技术社区 · 15 年前

在JSF中,我使用的是panelgrid,它相当于HTML中的表。How to set height=100% in it? 宽度=100%存在,但不存在高度。谢谢

1 回复 | 直到 15 年前

BalusC 15 年前

首先,JSF在这里是不相关的。现在一切都是关于它生成的HTML代码。在WebBrowser中打开页面,右键单击并查看源代码。集中你的注意力那个 HTML源代码。这就是CSS(和JS)所能看到和应用的全部内容。

我假设你的意思是100%高度的全视区高度(“可见”高度)。现在,要在CSS中实现全视区高度,只需设置 height: 100% 对于所需的HTML元素本身是不够的。它将与其父元素相关,所有到 <html 元素;所以如果你基本上有一个:

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>100% viewport height demo - FAIL</title>
        <style>
            .mytable { height: 100%; background: yellow; }
        </style>
    </head>
    <body>
        <table class="mytable"><tr><td>cell</td></tr></table>
    </body>
</html>

它将是 <body> 元素。的高度 <身体& 它本身与 <html> 元素。但这两个元素的高度不是100%。复制粘贴运行。您将看到,它不覆盖整个视区。

如果要获得完整的视区高度,则需要应用 身高:100% 两者都 <身体& 和 <HTML& GT; 元素也一样(当然您还需要重置页边距)。

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>100% viewport height demo - GOOD</title>
        <style>
            html, body { margin: 0; height: 100%; }
            .mytable { height: 100%; background: yellow; }
        </style>
    </head>
    <body>
        <table class="mytable"><tr><td>cell</td></tr></table>
    </body>
</html>

在JSF上也应用这些知识。这个 h:panelGrid 只渲染一个 <table> 元素。它的 styleClass 将呈现为HTML class 属性。

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

4 月前

Jamie · 在CSS链接的文件名中添加Jinja占位符

4 月前

ptownbro · 重叠分区标签,同时保持以下所有分区和内容就位

4 月前

Luke Frost IEng MIMechE · Bootstrap 5.3在Div中的项目位置没有如我所期望的那样显示

4 月前

Reegan · 使用Angular ngFor指令在html中渲染嵌套对象值

4 月前

wqyutv · 当找不到文件时,任何破坏错误的东西都不会出现,我该怎么解决这个问题?

5 月前

user29519291 · 为不同的变量创建一个带有可重用Click函数的简单菜单

5 月前

Gukkey · 在React中明确隐藏日期类型输入后,如果我单击父div,如何显示日期选择器?

5 月前

Lorenzo Bertolaccini · 在Angular项目中通过对话框后,在控制台中显示但在HTML中不显示的数据数组

5 月前

john Rizzo · 按钮背景颜色、悬停和活动状态存在问题

5 月前