处理表中的溢出 [英] Handling overflow in tables

问题描述

如果我有这样一个非常简单的例子：

  table {
 table-layout：fixed ; 
 width：300px; 
} 
 
 .td1 {
 width：100px; 
} 
 .td2 {
 width：200px; 
} 
  

和我的一个 .td2 包含一个图像，可以说， 300px 在 width 中。我想显示滚动条以允许用户滚动查看。然而，我不认为这是可能的，是吗？

所以我的问题是：
$ b $ ol

除了 hidden 之外，还有其他哪些选项用于处理表中的溢出？

只有在内容超出设定宽度时才可以显示滚动条？ （我发誓我在一些论坛软件中看到它，但我不记得是哪一个）

方案

pre>

内容被剪辑，滚动仅在必要时添加
。

将图片放入表格单元格的div中，并将div的宽度和高度设置为td的100％并设置为溢出的样式：auto

 < style> 
 .test {width：100％;身高：100％;溢出：自动; } 
< / style> 
 
< td> 
< div class =test> 
您的图片
< / div> 
< / td> 
  

If I have a table like this very very simple example:

table {
    table-layout:fixed;
    width:300px;
}

.td1 {
    width:100px;
}
.td2 {
    width:200px;
}

and in one of my .td2 contains an image that is, lets say, 300px in width. I would like to show scroll bars to allow users to scroll to see it all. However I don't think this is possible, is it?

So my questions are:

1. Are there any other options apart from hidden for handling overflow in tables?

2. Is it possible to show scroll-bars only when content pushes beyond a set width? (I swear I've seen it in some forum software but I can't remember which one)

解决方案

What about

overflow: auto

Content is clipped and scrolling is added only when necessary.

Put the image inside a div in the table cell and make the width and height of the div to be 100% of the td and style it to overflow: auto

<style>
.test { width: 100%; height: 100%; overflow: auto; } 
</style>

<td>
<div class="test">
your image
</div>
</td>

这篇关于处理表中的溢出的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！