如何滚动表格超出第11行?

时间:2012-05-31 10:59:51

标签: html css

我想将表格插入两行(<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;
}

1 个答案:

答案 0 :(得分:1)

overflow:auto;添加到#tablestyle,这会让您的div滚动过250px这是当前的高度