zoukankan      html  css  js  c++  java
  • 表格 滚动条 (tbody部分滚动)

    本文是从简书复制的, markdown语法可能有些出入, 想看"正版"和更多内容请关注 简书: 小贤笔记

    html

    <table>
        <thead>
            <tr>
                <th>开始年</th>
                <th>年效</th>
                <th>分享比例</th>
                <th>补贴电价</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>2018</td>
                <td>5</td>
                <td>5:9</td>
                <td>补贴电价</td>
            </tr>
            <tr>
                <td>2018</td>
                <td>5</td>
                <td>5:9</td>
                <td>补贴电价</td>
            </tr>
            <tr>
                <td>2018</td>
                <td>5</td>
                <td>5:9</td>
                <td>补贴电价</td>
            </tr>
            <tr>
                <td>2018</td>
                <td>5</td>
                <td>5:9</td>
                <td>补贴电价</td>
            </tr>
        </tbody>
    </table>
    

    css

    table {
         100%;
        border-collapse: collapse;
        text-align: center;
        tr {
            height: 0.44rem;
            td,th {
                 1rem;
            }
        }
        thead {
            display: block;
             100%;
            tr {
                background: #519FF1;
                font-size: 0.15rem;
                color: #FFFFFF;
                th {
                    font-weight: normal;
                }
            }
        }
        tbody {
            display: block;
             100%;
            height: 1.32rem;
            overflow: auto;
            tr:nth-child(odd) {
                background: #FFFFFF;
            }
            tr:nth-child(even) {
                background: #DCECFC;
            }
        }
    }
    
  • 相关阅读:
    R的农场 chebnear
    math
    求平面内最近点对
    字符加密 cipher
    CF448C Painting Fence
    CF264B Good Sequences
    洛谷3166 数三角形
    [NOIP2013] 华容道
    [NOIP2013] 货车运输
    [NOIP2013] 积木大赛
  • 原文地址:https://www.cnblogs.com/shenxianhui/p/9361896.html
Copyright © 2011-2022 走看看