Question

我想在我的网页上使用CSS来实现以下功能：

当表比父表小（宽度小）时的中心表容器
当表格比父容器宽时，确保滚动条可见。在这种情况下，表应该从父容器的左边缘开始（即没有额外的空间）。

我希望避免使用任何固定宽度来执行此操作（我希望这是一个可重用的组件）。

我可以使用display: block;使表格可滚动，但是第一次要求失败了。

Answer 1

设置子表的max-width或max-height属性，并设置overflow：auto以在宽度大于子项时启用滚动条。希望这有帮助！

Answer 2

使用 display：inline block将表放在div中;最大宽度：100％; 对于表 display：block;溢出：汽车;

例如：

   <div class="table-container">
      <table class="my-table"> ... </table>
   </div>

风格是：

   <style>
       body{
       text-align: center;
       }
       .table-container{
       display:inline block; 
       max-width:100%;
       }
       .my-table{
       display:block; 
       overflow:auto;
       }
   </style>

中心表小于父级时，否则滚动 - 没有固定宽度

2 个答案: