css - 使 tds 可滚动但将它留在原处？

Question

假设这是表格:

<table>
    <tbody>
         <tr>
             <th>something goes here</th>
             <td>dkjfkldfjlfjs</td> 
             <td>dkjfkldfjlfjs 4234324</td>
             <td>dkjfkldfjlfjfdgfdggs</td>
         </tr>
    </tbody>
</table>

是否有可能只从左向右滚动 tds 而将 th 留在原处？就像您在 Excel 中修复一列时，只有第一列(第 th 列)被卡住，其余列(所有 tds)立即滚动。

Answer 1

是的。您可以，只需应用 overflow-x:scroll; 和 display:inline-block; 即可实现您的目标。

WORKING DEMO

CSS:

td {
    display: inline-block;
    overflow-x: scroll;
}

希望这对您有所帮助。