Html 表格单元格的滚动条
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14136076/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
scroll bar for a table cell
提问by Prasanna
Is there a way to add a scroll bar to a 'td' tag? I have a dynamic content inside a 'td' tag. I want the 'td' to be of fixed size and if the content becomes larger than the 'td' size, I want a scroll bar to appear only on that particular cell. Is there a way to achieve this?
有没有办法将滚动条添加到“td”标签？我在“td”标签中有一个动态内容。我希望“td”具有固定大小，如果内容变得大于“td”大小，我希望滚动条仅出现在该特定单元格上。有没有办法实现这一目标？
回答by Denys Séguret
Yes you can do that.
是的，你可以这样做。
The easiest way is to put inside your cell a div filling it and set its overflowstyle property.
最简单的方法是在单元格内放置一个 div 填充它并设置其overflow样式属性。
CSS :
CSS :
div.scrollable {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow: auto;
}
HTML :
HTML :
<td><div class=scrollable>
Some content with a scrollbar if it's too big for the cell
</div></td>
If you want the scrollbar to be always visible, even when the content isn't cropped, replace autowith scrollin the CSS.
如果您希望滚动条始终可见，即使内容未被裁剪，请在 CSS 中替换auto为scroll。
回答by Parag
<table width ="400" >
<tr>
<td >
<div style="width:100%; max-height:300px; overflow:auto">Your content here
</div>
</td>
</tr>
</table>
Hope this helps
希望这可以帮助
回答by gopal sharma
You should need to provide either "height" Or "width" of div element, So that it would be scroll accordingly. for example you want to apply Scroll Vertically(Y-axis):-
您应该需要提供 div 元素的“高度”或“宽度”，以便相应地滚动。例如，您要应用垂直滚动（Y 轴）：-
<td><div class="scrollable">
Some content with a scrollbar if it's not fit in your customized container
</div></td>
div.scrollable
{
width:100%;
height: 100px;
margin: 0;
padding: 0;
overflow-y: scroll
}
