html - 如何将表格滚动到第 11 行以外？

Question

我想将表格插入两行 ( <hr /> <hr> ) 并保持每行的高度，以便第 11 行之后的行将看不到它们，但可以通过滚动看到它们。我的代码 html 这么长，更容易进入链接示例。谢谢 see example

style code:
html { height: 100%; width: 100%; }
body { height: 100%; width: 100%; margin: 0; padding: 0; border: 0; background: #FFFFFF;
  font: 13px/15px Verdana,Arial,Helvetica,sans-serif; }
img { border: none; }
table, tr, td, tr { 
    border-collapse:collapse; 
    vertical-align: top; 
    text-align: left;
    font: 13px/15px Verdana,Arial,Helvetica,sans-serif; }
a { color: #8D0D19;}

table.bordered tr th, table.bordered tr td { 
    border: 1px solid #000000;


    }
table caption, table th, table td {
    margin: 2px;
    padding: 2px 2px;
    vertical-align: top;
}


#pagination .selected { font-weight: bold; color: #8D0D19;}
table tr.odd {
    background: none repeat scroll 0 0 #E5E5E5;
}
table tr.even {
    background: none repeat scroll 0 0 #F0FFF0;
}
table{
    margin: 5px auto;
}
#tablestyle{
    height:250px;
}
th {
    background: azure;
    color: #000000;
    font-weight: bold;
}
table tr.even:hover,  .hover{
    background:#A2D2E1;
    }

table tr.odd:hover, .hover{
    background:#BBB2E1;
    }
table tD:hover, .hover{
    background:#FFFF00;
    }
.display{
    background:red;
    width:250px;
    height:20px;
    font-size:20px;
}   
.edittd
{
font-size:14px;
width:200px;
background-color:yellow;
border:solid 1px #000;
padding:4px;
}
.statuSnoChange{
    font-size:14px;
    width:100px;
   height:20px;
    background:azure;
}
.statuSChange{
    font-size:14px;
    width:150px;
     height:20px;
    background:#FFFF00;
}

Answer 1

将 overflow:auto; 添加到 #tablestyle，这将使您的 div 滚动超过当前高度 250px