原生table固定操作列

html代码

<table class="table-container" border cellpadding="0" cellspacing="0">
    <thead>
        <th>Column1</th>
        <th>Column2</th>
        <th>Column3</th>
        <th>Column4</th>
        <th>Column5</th>
        <th>Column6</th>
        <th>Column7</th>
        <th>Column9</th>
        <th class="operation-th">操作</th>
    </thead>
    <tbody>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
            <td>6</td>
            <td>7</td>
            <td>8</td>
            <td class="operation-td">
                <span>编辑</span>
                <span>删除</span>
                <span>复制</span>
            </td>
        </tr>
    </tbody>
</table>

css代码

.table-container {
    table-layout: fixed;
    width: 100%;
    border-collapse: separate;
}

td,th {
    width: 140px;
    box-sizing: border-box;
}
.operation-th {
    position: sticky !important;
    left: 0;
    right: 0;
    text-align: center;
    width: 150px;
    z-index: 3;
    border-left: 1px solid #ebeef5;
    background: #ffffff;
}
.operation-td {
    background-color: #ffffff;
    position: sticky !important;
    right: 0;
    text-align: center;
    width: 150px;
    z-index: 3;
    border-left: 1px solid #ebeef5;
}

效果