原生table样式

HTML

<div>
                        <table style="width: 100%;">
                            <thead>
                                <tr>
                                    <th style="width:25%;">董事会</th>
                                    <th style="width:25%;">监事会</th>
                                    <th style="width:25%;">股东</th>
                                    <th style="width:25%;">经理层</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <th style="width:25%;" @click="goOrg(item)">{{item.org1}}</th>
                                    <th style="width:25%;" @click="goOrg(item)">{{item.org1}}</th>
                                    <th style="width:25%;" @click="goOrg(item)">{{item.org1}}</th>
                                    <th style="width:25%;" @click="goOrg(item)">{{item.org1}}</th>
                                </tr>
                            </tbody>
                        </table>

                    </div>

CSS

<style scoped>
    table {
        border-collapse: collapse;
        margin: 0 auto;
        text-align: center;
        width: 100%;
    }

    table td,
    table th {
        border: 1px solid #e4e4e4;
        color: #666;
        height: 30px;
    }

    table thead th {
        background-color: #CCE8EB;
        width: 100px;
    }

    table tr:nth-child(odd) {
        background: #fff;
    }

    table tr:nth-child(even) {
        background: #f2f9ff;
    }

    th {
        font-size: 12px;
        color: #1989fa !important;
    }

    .th_ {
        background: #d1e7ff !important;
    }

    td {
        font-size: 12px !important;
        padding: 10px;
    }
</style>