让原生table的tbody达到一定的高度显示滚动条，并修改滚动条的默认样式

效果图：

HTML：

<table class="coupon-table" cellspacing="0">
    <thead class="coupon-thead">
        <tr>
            <th>券种类</th>
            <th>优惠券链接</th>
            <th>券消费限额</th>
            <th>券面额</th>
            <th>券总数</th>
            <th>券剩余数</th>
            <th>券领取数</th>
            <th>领取时间</th>
            <th>生效时间</th>
        </tr>
    </thead>
    <tbody class="coupon-tbody">
        <tr>
            <td>1111</td>
            <td>2222</td>
            <td>3333</td>
            <td>4444</td>
            <td>5555</td>
            <td>6666</td>
            <td>7777</td>
            <td>8888</td>
            <td>9999</td>
        </tr>
        <tr>
            <td>1111</td>
            <td>2222</td>
            <td>3333</td>
            <td>4444</td>
            <td>5555</td>
            <td>6666</td>
            <td>7777</td>
            <td>8888</td>
            <td>9999</td>
        </tr>
    </tbody>
</table>

tbody显示滚动条的主要CSS（当然还要调一下样式表格才更好看）：

.coupon-table {
    width: 100%;
}
.coupon-thead {
    width: 100%;
    display: inline-block;
}
.coupon-tbody {
    width: 100%;
    max-height: 60px;
    display: inline-block;
    overflow-y: auto;
}

修改滚动条的默认样式：

/* 滚动条宽度 */
.coupon-tbody::-webkit-scrollbar {
    width: 5px;
}
/* 滚动条背景色和圆角 */
.coupon-tbody::-webkit-scrollbar-thumb {
    background-color: #90A7FA;
    border-radius: 2px;
}
/* 滚动轨道背景色 */
.coupon-tbody::-webkit-scrollbar-track {
    background-color: #eee;
}