Question

我使用了width属性对于所有列但在显示中，不会调整列。

我可以这样做吗？如果，请指导我按照我的要求实现列宽。

Answer 1

您可以使用硬编码值：

<p:column style="width:20px">

或百分比：

<p:column style="width:20%">

取决于最适合你的。

Answer 2

您必须使用columnClasses属性并使用逗号（，）分隔每个列样式。下面的代码示例显示了如何使用columnClassess属性。

头标记：

<style type="text/css">
            .column1{width: 10px;height:auto}
            .column2{width: 5px;height:auto}
            .column3{width: 20px;height:auto}
           </style>

身体标签中的

：

<p:panelGrid columnClasses="column1,column2,column3" columns="4" style="width: 100%" >  
                    <p:column></p:column>                        
                    <p:column></p:column>
                    <p:column></p:column> 
                    <p:column></p:column> 
                </p:panelGrid>

它也适用于h：panelGrid标签。

Answer 3

我建议你使用primefaces showcase 中描述的ui-grid-col css类。其中12 = 100％

<div class="ui-grid ui-grid-responsive">
 <div class="ui-grid-row">
  <div class="ui-grid-col-2">
     <h:outputText value="To :" />
  </div>    
  <div class="ui-grid-col-4">
      <h:outputText value="#{bean.name}" />
  </div> 
</div>
<div class="ui-grid-row">
   <div class="ui-grid-col-2">
    <h:outputText value="Address :" />
  </p:column>  
  <div class="ui-grid-col-4">
    <p:outputLabel value="#{bean.address}" />  
  </div>
</div>

如何调整<p：panelgrid>中<p：column>的宽度？</p：panelgrid> </p：column>

3 个答案: