Vas*_*kas 4 html css html-table
我有一个表,当它的内容超过行的指定高度时,我想在td上显示一个垂直滚动条.
我有这个示例代码,但无论内容如何,它都不会在y轴上显示活动滚动条.
小智 11
浏览器不会将溢出滚动条应用于TD
标记.您需要将表格单元格的内容括在div
标记中,然后滚动:
<td><div>Do you see what I meancxzdaaaaaaaaaaaaa?</div></td>
Run Code Online (Sandbox Code Playgroud)
和:
td > div { overflow-y:scroll;overflow-x:hidden;}
Run Code Online (Sandbox Code Playgroud)
Overflow:scroll;
应该在块级元素上提供滚动条,而td
否。它应该对a做些什么td
?CSS规范对此尚不明确,因此浏览器的行为有所不同。
Chrome将应用滚动条,但FF和IE不会。对于跨浏览器的解决方案,您可以添加一个额外的容器div,然后将CSS应用于该容器。
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<title>Test</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style type="text/css">
table { width:250px;table-layout:fixed;border-collapse:collapse }
table tr { height:1em; }
td > div { overflow-y:scroll;overflow-x:hidden;}
</style>
</head>
<body>
<table border="1">
<tr>
<td>This is a test.</td>
<td><div>Do you see what I meancxzdaaaaaaaaaaaaa?</div></td>
<td>I hate this overflow.</td>
</tr>
</table>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)