zoukankan      html  css  js  c++  java
  • table给tbody设置滚动条

    table结构例子:

    <table class="layui-table">
                    <thead>
                        <tr>
                            <th>
                                贷款项目
                            </th>
                            <th>
                                贷款类型
                            </th>
                            <th>
                                所属公司
                            </th>
                            <th>
                                产品联系人
                            </th>
                            <th>
                                是否上线
                            </th>
                            <th>
                                联系电话
                            </th>
                            <th>
                                点击量(详情)
                            </th>
                            <th>
                                访问量(详情)
                            </th>
                            <th>
                                点击量(申请)
                            </th>
                            <th>
                                访问量(申请)
                            </th>
                            <th>
                                点击量(子页面)
                            </th>
                            <th>
                                访问量(子页面)
                            </th>
                        </tr>
                    </thead>
                    <tbody id="x-img">
                    </tbody>
                    <tfoot>
                        <tr style="background: #f2f2f2;">
                            <td >总计:</td>
                            <td align="center">——</td>
                            <td align="center">——</td>
                            <td align="center">——</td>
                            <td align="center">——</td>
                            <td align="center">——</td>
                            <td class="djCount1"></td>
                            <td class="fwCount1"></td>
                            <td class="djCount"></td>
                            <td class="fwCount"></td>
                            <td class="djCount3"></td>
                            <td class="fwCount3"></td>
                        </tr>
                    </tfoot>
                </table>

    css如下:

    table tbody {
             display:block;
             max-height:500px;
             overflow-y:scroll;
             overflow-x:hidden;
         }
         ::-webkit-scrollbar {
              1px;
         }
         table thead,tbody tr,tfoot tr,thead tr {
             display:table;
             100%;
             table-layout:fixed;
         }
  • 相关阅读:
    清北刷题班day3 morning
    [NOI1997] 积木游戏(dp)
    [NOI1999] 棋盘分割(推式子+dp)
    2017北京国庆刷题Day7 afternoon
    湖南集训day8
    湖南集训day7
    湖南集训day6
    湖南集训day5
    湖南集训day4
    湖南集训day3
  • 原文地址:https://www.cnblogs.com/007sx/p/9761166.html
Copyright © 2011-2022 走看看