我有以下格式的HTML表：
+-------------+-------------+----------+
| Single line | Single line | Very, |
| | | very |
| | | long |
| | | text, |
| | | going |
| | | over |
| | | multiple |
| | | screen |
| | | pages |
+-------------+-------------+----------+
| Next line | ... | ... |
滚动表格时，我遇到一个问题，即“单行”条目不可见，这使该表格（甚至更多）难以处理。
有没有一种方法可以使CSS或简单的JavaScript / jQuery使单行条目保持可见（当然，在其单元格内）？
对于代码，它实际上只是页面上包含jQuery的HTML表：
<table>
<thead>
<tr>
<th>Head</th><th>Head</th><th>Head</th>
</tr>
</thead>
<tbody>
<tr>
<td>Short</td>
<td>Short</td>
<td>Long, long, long</td>
</tr>
<tr>
<td>Short</td>
<td>Short</td>
<td>Long, long, long</td>
</tr>
</tbody>
</table>
我不是在寻找具体的解决方案，而是在向正确的方向推进。
答案 0 :(得分：3)
是的，您可以将内容放入td中的另一个元素中，例如span，然后将其设置为position: sticky和top: 0;
table {
max-width: 240px;
}
table tr td{
vertical-align: top;
}
table tr td > *{
top: 0;
position: sticky;
}<table border="1">
<thead>
<th>Column 1</th>
<th>Column 2</th>
</thead>
<tbody>
<tr>
<td><span>Single Line</span></td>
<td><span>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eum optio corporis alias esse. Veniam facilis odio doloribus nostrum molestias architecto! Doloremque cum exercitationem aspernatur corrupti, ullam blanditiis modi. Et, ut! Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eum optio corporis alias esse. Veniam facilis odio doloribus nostrum molestias architecto! Doloremque cum exercitationem aspernatur corrupti, ullam blanditiis modi. Et, ut! Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eum optio corporis alias esse. Veniam facilis odio doloribus nostrum molestias architecto! Doloremque cum exercitationem aspernatur corrupti, ullam blanditiis modi. Et, ut! Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eum optio corporis alias esse. Veniam facilis odio doloribus nostrum molestias architecto! Doloremque cum exercitationem aspernatur corrupti, ullam blanditiis modi. Et, ut! Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eum optio corporis alias esse. Veniam facilis odio doloribus nostrum molestias architecto! Doloremque cum exercitationem aspernatur corrupti, ullam blanditiis modi. Et, ut! Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eum optio corporis alias esse. Veniam facilis odio doloribus nostrum molestias architecto! Doloremque cum exercitationem aspernatur corrupti, ullam blanditiis modi. Et, ut! Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eum optio corporis alias esse. Veniam facilis odio doloribus nostrum molestias architecto! Doloremque cum exercitationem aspernatur corrupti, ullam blanditiis modi. Et, ut! Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eum optio corporis alias esse. Veniam facilis odio doloribus nostrum molestias architecto! Doloremque cum exercitationem aspernatur corrupti, ullam blanditiis modi. Et, ut! Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eum optio corporis alias esse. Veniam facilis odio doloribus nostrum molestias architecto! Doloremque cum exercitationem aspernatur corrupti, ullam blanditiis modi. Et, ut! Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eum optio corporis alias esse. Veniam facilis odio doloribus nostrum molestias architecto! Doloremque cum exercitationem aspernatur corrupti, ullam blanditiis modi. Et, ut!</span></td>
</tr>
<tr>
<td><span>Another Single Line</span></td>
<td><span>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eum optio corporis alias esse. Veniam facilis odio doloribus nostrum molestias architecto! Doloremque cum exercitationem aspernatur corrupti, ullam blanditiis modi. Et, ut! Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eum optio corporis alias esse. Veniam facilis odio doloribus nostrum molestias architecto! Doloremque cum exercitationem aspernatur corrupti, ullam blanditiis modi. Et, ut! Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eum optio corporis alias esse. Veniam facilis odio doloribus nostrum molestias architecto! Doloremque cum exercitationem aspernatur corrupti, ullam blanditiis modi. Et, ut! Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eum optio corporis alias esse. Veniam facilis odio doloribus nostrum molestias architecto! Doloremque cum exercitationem aspernatur corrupti, ullam blanditiis modi. Et, ut! Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eum optio corporis alias esse. Veniam facilis odio doloribus nostrum molestias architecto! Doloremque cum exercitationem aspernatur corrupti, ullam blanditiis modi. Et, ut! Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eum optio corporis alias esse. Veniam facilis odio doloribus nostrum molestias architecto! Doloremque cum exercitationem aspernatur corrupti, ullam blanditiis modi. Et, ut! Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eum optio corporis alias esse. Veniam facilis odio doloribus nostrum molestias architecto! Doloremque cum exercitationem aspernatur corrupti, ullam blanditiis modi. Et, ut! Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eum optio corporis alias esse. Veniam facilis odio doloribus nostrum molestias architecto! Doloremque cum exercitationem aspernatur corrupti, ullam blanditiis modi. Et, ut! Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eum optio corporis alias esse. Veniam facilis odio doloribus nostrum molestias architecto! Doloremque cum exercitationem aspernatur corrupti, ullam blanditiis modi. Et, ut! Lorem ipsum, dolor sit amet consectetur adipisicing elit. Eum optio corporis alias esse. Veniam facilis odio doloribus nostrum molestias architecto! Doloremque cum exercitationem aspernatur corrupti, ullam blanditiis modi. Et, ut!</span></td>
</tr>
</tbody>
</table>