CSS：設置表td的高度和溢出滾動

我有一個表，我想要顯示一個垂直滾動條的td時，其內容超過了行的指定高度。CSS：設置表td的高度和溢出滾動

我有this示例代碼，但無論內容如何，它都不會在y軸上顯示活動滾動條。

2012-12-27 Vassilis Barzokas

瀏覽器不會將溢出滾動條應用於TD標記。您需要將您的表格單元格的內容括在一個div標籤，並滾動認爲：

<td><div>Do you see what I meancxzdaaaaaaaaaaaaa?</div></td>

和：

td > div { overflow-y:scroll;overflow-x:hidden;}

來源

2012-12-27 17:20:10

謝謝，只是爲了補充一點，您必須指定所需的div高度才能正確顯示滾動條。 –

應該給一個塊級元素上的滾動條，其中td不是。 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>

來源

2012-12-27 17:20:23 mikel

td > div { overflow-y:auto;}

在需要的時候這將增加垂直滾動條。

來源

2015-10-26 08:52:28

CSS：設置表td的高度和溢出滾動

回答

相關問題