CSS固定表頭和前三列是很常用的功能，特別是在大型數據表格中，可以提升用戶體驗和數據可讀性。下面我們來介紹如何實現這個功能。

首先，我們需要將表格的布局調整為固定表格布局（fixed table layout），這樣可以使得表格中的每一列寬度都是固定的，并且表格的布局更加穩定。示例代碼如下：

table {
table-layout: fixed;
}

接著，我們需要將表格頭部和前三列固定在頁面中，這部分代碼我們可以使用CSS的position屬性來實現。具體實現方式如下：

thead {
position: sticky;
top: 0;
background-color: #fff;
z-index: 1;
}
td:nth-child(-n+3) {
position: sticky;
left: 0;
background-color: #fff;
z-index: 1;
}

這里的關鍵就是利用position:sticky屬性來將表格頭部和前三列進行固定，同時利用z-index屬性來控制它們的層級關系，使得固定部分在滾動時始終處于上層。

最后，我們需要設置表格主體部分可以滾動，并且在滾動時固定的表頭和前三列依然保持不動。示例代碼如下：

tbody {
display: block;
height: 400px;
overflow-y: scroll;
}
tr {
width: 100%;
display: table;
table-layout: fixed;
}
td {
display: table-cell;
text-align: center;
border: 1px solid #ddd;
}

這里需要注意的是，我們需要將tbody部分的display屬性設置為block，同時設置一個固定的高度（這里設置的是400px），并將overflow-y屬性設置為scroll，這樣才能實現表格主體部分的滾動。

最后，我們將tr標簽的屬性設置為table和table-layout屬性的固定值，以確保表格主體部分的每一列的寬度都是一致的。

綜上所述，通過上述的CSS代碼和方法，我們就可以實現CSS固定表頭和前三列的功能了。這個功能可以幫助我們更好地呈現大量的數據，提高用戶體驗和數據的可讀性。