Question

假设ImportError: Could not import PIL.Image. The use of有requires PIL. table

表行是动态生成的。如果行数受限制或小于高度，则将根据高度进行调整。像这样

如果增加行数，则内容将自动开始溢出，并且表大小将根据内容开始增加

但是要求是伸展。我正在尝试根据固定高度来拉伸表格，而不是内容溢出，无论行数是多少，都应在提供的高度上进行拉伸。例如：在此处200px

我曾经尝试过使用div嵌套表格。

height

但是没有被拉长。

对于图片，我们可以应用200px-> #table_container{ width:500px; height:200px; } #table_container table{ width:100%; height:100%; }

任何CSS方法或JS插件可以拉伸到特定高度吗？不调整大小。

object-fit

cover, fill, contain

Answer 1

我不建议这样做：如果遇到一个场景，其中有数百个表行，则表将变得不可读。为什么不使用overflow使其可滚动？

table {
  border-collapse: collapse;
  width:500px;
  height:100px!important;
  text-align:center;
  display:block;
  overflow-y:auto;
}
table td, table th {
  border: 1px solid #ddd;
}

<html>
  <head>
  </head>
  <body>
    <table>
      <tr>
        <th>S.N.</th>
        <th>Name</th>
        <th>Faculty</th>
      </tr>
      <tr>
        <td>1</td>
        <td>Richa</td>
        <td>Science</td>
      </tr>
      <tr>
        <td>2</td>
        <td>Rohan</td>
        <td>MGMT</td>
      </tr>
      <tr>
        <td>3</td>
        <td>Sahil</td>
        <td>Arts</td>
      </tr>
      <tr>
        <td>4</td>
        <td>Rocky</td>
        <td>Lab</td>
      </tr>
      <tr>
        <td>5</td>
        <td>John</td>
        <td>IT</td>
      </tr>
     </table>
  </body>
</html>

CSS / JS拉伸表根据高度

1 个答案: