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;
         }
  • 相关阅读:
    Session的配置
    插件编程小窥
    今日遇到了困难,顺便看了下SMO
    初识三层架构
    .NET文件类库
    JQuery学习笔记
    反射整理学习<二>
    通俗道破单例模式
    菜鸟写代码生成器最后一天完结篇
    卧谈会:委托与事件
  • 原文地址:https://www.cnblogs.com/007sx/p/9761166.html
Copyright © 2011-2022 走看看