CSS表格固定前四列是指在一個表格中，前四列不隨滾動條而移動。這樣可以使頁面在瀏覽很多數據時變得更加方便。下面我們來看一下如何使用CSS實現固定前四列的效果。

table {
width: 100%;
}
td {
border: 1px solid #ccc;
text-align: center;
}
tr:nth-child(1) td:nth-child(-n+4) {
position: sticky;
left: 0;
z-index: 1;
background-color: #f2f2f2;
}
tbody {
display: block;
overflow: auto;
height: 200px;
}
td:nth-child(-n+4) {
position: sticky;
left: 0;
background-color: #f2f2f2;
}

首先，我們給表格設置了100%的寬度，每一個單元格都有1像素的灰色邊框，并采用居中對齊方式。接著，我們使用CSS選擇器:nth-child來選定表格中的第一行的前四列，并將它們固定在左邊。我們給這四列的單元格設置了position:sticky，表示將它們固定在滾動條左邊。然后，我們為這些單元格設置了left:0，表示它們距離左邊緣的距離為0，這樣它們就會固定到表格的最左側。我們 also 給這些單元格設置了一個高于其他單元格的z-index，這可以確保這些單元格的z-index比其他單元格更高，從而使它們始終處于表格頂部。

接著，我們為tbody元素設置了display:block和overflow:auto屬性，這意味著該元素可以獨立滾動。我們也為它設置了一個固定高度的值，這樣它就不會占用整個頁面，而只是顯示出設置的高度。最后，我們再次使用:nth-child來選定前四列的單元格，這樣它們就會固定在表格的最左側，且不會隨著滾動條而移動。我們還為這些單元格設置了一個灰色的背景色，以區分它們和其他列。

通過上述代碼，我們就能夠輕松實現CSS表格固定前四列的效果了。希望這篇文章對您有所幫助。