Question

我已经开始为我的网站开发 JSF + Primefaces 最新版本，这有点可能，我可以使我的设计对这些技术做出响应。我不想使用 Primefaces 移动设备，或者我不想为同一功能创建两个不同的页面

Answer 1

PrimeFaces 6.x具有响应式设计更新，包括Responsive Grid。

网格不是JSF组件，它是一个带有ui-grid类的简单div。

3列布局示例：

<div class="ui-grid">
   <div class="ui-grid-col-4">Col1</div>
   <div class="ui-grid-col-4">Col2</div>
   <div class="ui-grid-col-4">Col2</div>
 </div>

在实际情况下，只有网格的情况不会满足要求，因此您通常应使用bootstrap或foundation等框架。

两个框架都提供CSS / Javascript规则，它们可以轻松应用于JSF组件，例如，如果你有一个按钮：

<h:commandButton styleClass="btn" value="Button">
</h:commandButton>

btn是一个bootstrap CSS类。

您可能遇到一些不接受此类样式的组件，例如Primefaces表，在这些情况下，您应该编写自己的CSS media queries / Javascript以保持响应性。

查看更多

JSF and Twitter Bootstrap Integration

Jsf + Primefaces响应式设计

1 个答案: