如何在特定内容上应用 css 溢出属性答案

【问题标题】：How to apply css overflow property on specific content如何在特定内容上应用 css 溢出属性
【发布时间】：2014-06-24 06:20:22
【问题描述】：

我正在为<form> 应用溢出属性，以我使用<legend> 的形式。这里溢出适用于整个表单，所以如果溢出需要滚动条也包括图例。但我希望溢出必须应用除了图例标签。我的意思是我使用表格的形式和图例。我希望溢出只适用于表。

这是我的小提琴，

http://jsfiddle.net/raghavendram040/z6jRX/1/

我的 html 是，

<form>
<fieldset>
<legend>&nbsp;&nbsp;&nbsp;Menu</legend>
<table id="tab">
    <tr>
        <td>abc</td>
    </tr>
    <tr>
        <td>abc</td>
    </tr>
    <tr>
        <td>abc</td>
    </tr>
    <tr>
        <td>abc</td>
    </tr>
    <tr>
        <td>abc</td>
    </tr>
    <tr>
        <td>abc</td>
    </tr>
    <tr>
        <td>abc</td>
    </tr>
    <tr>
        <td>abc</td>
    </tr>
    <tr>
        <td>abc</td>
    </tr>
    <tr>
        <td>abc</td>
    </tr>
    <tr>
        <td>abc</td>
    </tr>
    </table>
</fieldset>

我的 CSS 是，

form{
  border: 1px #6A6A45 solid;
  border-radius:6px;
  height: 200px;
  overflow: auto;
  background-color:#efefef ;
  margin-bottom: 17px;

}

要应用溢出，我试过这样但没有用

#tab{ overlow: auto }

我该如何解决这个问题，谁能帮助我。

【问题讨论】：

标签： javascript html css twitter-bootstrap-3

【解决方案1】：

将您的表格包装在 div 中并对其应用溢出。

Have a fiddle!

HTML

<form>
<fieldset>
    <legend>&nbsp;&nbsp;&nbsp;Menu</legend>
    <div id="scroll">
        <table id="tab">
            <tr>
                <td>abc</td>
            </tr>
          ...
        </table>
    </div>
</fieldset>
</form>

CSS

#scroll {
    overflow: scroll;
    height: 140px;
}

【讨论】：

谢谢你。 .它解决了我的 pbm 但我有一个小问题，在另一个表中我需要保持表头不变并且需要滚动条到表行。如何做到这一点，请帮助我。
有很多解决方案:) Here is a similar question
wer 是该表的 css。

【解决方案2】：

你可以用 div 元素包裹你的表格：

Working Demo

<div id="tab">
    <table>
    </table>
</div>

【讨论】：

谢谢你。 .它解决了我的 pbm 但我有一个小问题，在另一个表中我需要保持表头不变并且需要滚动条到表行。如何做到这一点，请帮助我。
好的..更新上面的小提琴来说明你的问题。