如何使用trbody，thead修复tr并滚动其他tr？

Question

body { height: 1000px; }
#header-fixed { 
    position: fixed; 
    top: 0px; display:none;
    background-color:white;
}
.over{
overflow-y: scroll !important;
}

<table id="table-1">
        <tr id="header-fixed" >
            <td>Col1</td>
            <td>Col2</td>
            <td>Col3</td>
        </tr>

<span class="over">
        <tr>
            <td>info</td>
            <td>info</td>
            <td>info</td>
        </tr>
        <tr>
            <td>info</td>
            <td>info</td>
            <td>info</td>
        </tr>
        <tr>
            <td>info</td>
            <td>info</td>
            <td>info</td>
        </tr>
        </span>
</table>

此处id固定为id的tr应该是固定的，并且class超过span的tr只能垂直向下滚动。请帮我解决这个问题。