0

我无法将 CSS 样式应用于我的动态表。我正在连接到数据库，并且我知道数据已正确填充并显示。我的问题是有 900 条记录，我想限制表格大小，使用滚动条。我已经阅读了其他软件，完成此操作的正确 CSS 样式节点是：如何指定表格的高度以使垂直滚动条出现？

溢出：自动；

高度：700px；

显示：块；

溢出-y：滚动；

起初，我尝试使用内联样式进行此操作（禁止...我意识到），但它没有用。我已经阅读了有关向表和/或单个行添加“类”的信息，这将反映在我的 CSS 样式表中，但我似乎无法弄清楚如何实现这一点。当我在 PHP 中添加“span”或“class”标签指示符时出现语法错误（我想象使用“ECHO”——这两个都需要双引号）。

我正在努力完成的一个很好的例子：http ://www.timrivera.com/tests/csstables.html#markupIE

下面的 PHP 代码片段有很好的语法，但我不知道在哪里适当地添加类或跨度指示符。需要注意的一件事 - 我需要为不同的表格设置不同的样式，因此更改全局“表格”CSS 是行不通的。 

//Function that gets the SQL recordset. 
$result2 = Get_Package_Info_EXT($conn, $var_PartNumber);
//do the table edits here.
   echo "<table border='1' >
  <tr>
  <th>Facility</th>
  <th>Process Flow</th>
  <th>Operation</th>
  <th>Device</th>
  <th>Item</th>
  <th>Value</th>
  <th>Database Source</th>

  </tr>";

  while($row2 = oci_fetch_array($result2)){
  echo "<tr>";
  echo "<td>" . $row2['FACILITY_AT'] . "</td>";
  echo "<td>" . $row2['SUB_FLOW_TYPE'] . "</td>";
  echo "<td>" . $row2['OPN_NAME'] . "</td>";
  echo "<td>" . $row2['SPEC_DEVICE'] . "</td>";
  echo "<td>" . $row2['COMPONENT_NAME'] . "</td>";
  echo "<td>" . $row2['COMPONENT_VALUE'] . "</td>";
  echo "<td>" . $row2['SOURCE'] . "</td>";
  echo "</tr>";
  }
  echo "</table>";
4

3 回答 3

0

我认为最好的方法是在桌子周围包裹一个 div 并给 div 一个高度。

http://phpfiddle.org/main/code/i7h-9b1

<style type="text/css">
    #scroll {
        height: 100px; /* Max height of table */
        overflow-y: scroll;
        width: 340px;
    }
</style>

<div id="scroll">
    table
</div>

使用您的代码：

echo '
<style type="text/css">
     #scroll {
         height: 100px; /* Max height of table */
         overflow-y: scroll;
         width: 340px;
    }
</style>';

//Function that gets the SQL recordset. 
$result2 = Get_Package_Info_EXT($conn, $var_PartNumber);
//do the table edits here.
   echo "<div id='scroll'><table border='1' >
  <tr>
  <th>Facility</th>
  <th>Process Flow</th>
  <th>Operation</th>
  <th>Device</th>
  <th>Item</th>
  <th>Value</th>
  <th>Database Source</th>

  </tr>";

  while($row2 = oci_fetch_array($result2)){
  echo "<tr>";
  echo "<td>" . $row2['FACILITY_AT'] . "</td>";
  echo "<td>" . $row2['SUB_FLOW_TYPE'] . "</td>";
  echo "<td>" . $row2['OPN_NAME'] . "</td>";
  echo "<td>" . $row2['SPEC_DEVICE'] . "</td>";
  echo "<td>" . $row2['COMPONENT_NAME'] . "</td>";
  echo "<td>" . $row2['COMPONENT_VALUE'] . "</td>";
  echo "<td>" . $row2['SOURCE'] . "</td>";
  echo "</tr>";
  }
  echo "</table></div>";
于 2013-03-22T15:42:15.590 回答
0

编辑您的 PHP 代码以...

//Function that gets the SQL recordset. 
$result2 = Get_Package_Info_EXT($conn, $var_PartNumber);
//do the table edits here.
  echo "<div class=\"table-container\">";
  echo "<table border='1' >
  <tr>
  <th>Facility</th>
  <th>Process Flow</th>
  <th>Operation</th>
  <th>Device</th>
  <th>Item</th>
  <th>Value</th>
  <th>Database Source</th>

  </tr>";

  while($row2 = oci_fetch_array($result2)){
  echo "<tr>";
  echo "<td>" . $row2['FACILITY_AT'] . "</td>";
  echo "<td>" . $row2['SUB_FLOW_TYPE'] . "</td>";
  echo "<td>" . $row2['OPN_NAME'] . "</td>";
  echo "<td>" . $row2['SPEC_DEVICE'] . "</td>";
  echo "<td>" . $row2['COMPONENT_NAME'] . "</td>";
  echo "<td>" . $row2['COMPONENT_VALUE'] . "</td>";
  echo "<td>" . $row2['SOURCE'] . "</td>";
  echo "</tr>";
  }
  echo "</table>";
  echo "</div>";

然后只需使用样式

div.table-container table {}
于 2013-03-22T15:44:10.010 回答
0

使用 Calum 的样式格式，您可以这样做：

//Function that gets the SQL recordset. 
$result2 = Get_Package_Info_EXT($conn, $var_PartNumber);
//do the table edits here.
echo "<style>#size{height:100px;width:340px;overflow-y:scroll;}</style>";
echo "<table id='size' border='1'>
<tr>
<th>Facility</th>
<th>Process Flow</th>
<th>Operation</th>
<th>Device</th>
<th>Item</th>
<th>Value</th>
<th>Database Source</th>

</tr>";

while($row2 = oci_fetch_array($result2)){
echo "<tr>";
echo "<td>" . $row2['FACILITY_AT'] . "</td>";
echo "<td>" . $row2['SUB_FLOW_TYPE'] . "</td>";
echo "<td>" . $row2['OPN_NAME'] . "</td>";
echo "<td>" . $row2['SPEC_DEVICE'] . "</td>";
echo "<td>" . $row2['COMPONENT_NAME'] . "</td>";
echo "<td>" . $row2['COMPONENT_VALUE'] . "</td>";
echo "<td>" . $row2['SOURCE'] . "</td>";
echo "</tr>";
}
echo "</table>";

我对其进行了测试并且工作正常。对于不同的表格样式，您可以：

<style>
#table1
{
style code here
}

#table2
{
style code here
}
</style>

依此类推...然后您可以将它们应用于表格：

<table id="table1">
...
</table>
<table id="table2">
...
</table>
于 2013-03-22T17:39:42.833 回答