CSS表格評分寬度是讓我們對表格中數據的評分進行顯示的一種方式，通常在網站的評論、評價、申請等板塊中使用。通過CSS屬性調整，我們可以輕松地控制這些表格的展示寬度、顏色、字體等樣式。

.score-table {
display: inline-block; // 允許多個表格并排顯示
width: 400px; // 設置表格寬度
border-collapse: collapse; // 合并邊框樣式
}
.score-table th, .score-table td {
padding: 10px; // 單元格內邊距
text-align: center; // 文字居中
border: 1px solid #ccc; // 邊框顏色
}
.score-table th {
background-color: #f3f3f3; // 表頭背景顏色
font-size: 18px; // 表頭字體大小
}
.score-table td {
font-size: 14px; // 數據字體大小
color: #333; // 數據字體顏色
}
.score {
width: 100%;
height: 20px;
background: #e1e1e1;
position: relative;
display: inline-block;
}
.score span {
display: block;
height: 20px;
position: absolute;
top: 0;
left: 0;
background: #ffa800;
overflow: hidden;
white-space: nowrap;
z-index: 1;
border-right: 1px solid #ccc;
}
.score-text {
display: inline-block;
position: relative;
z-index: 2;
margin-left: 10px;
}

上面是基本的CSS樣式設置，其中.score表示評分條的樣式，.score-text表示評分條后面的文字樣式。接下來，我們看一下如何將它們應用到HTML表格中。以下是一個3行2列的表格示例：

<table class="score-table"><thead><tr><th>項目</th><th>得分</th></tr></thead><tbody><tr><td>項目1</td><td><div class="score" style="width: 80%;"><span></span></div><p class="score-text">80分</p></td></tr><tr><td>項目2</td><td><div class="score" style="width: 60%;"><span></span></div><p class="score-text">60分</p></td></tr></tbody></table>

在HTML表格中，我們將評分使用div標簽嵌套span標簽實現。其中，span標簽的寬度通過CSS屬性進行控制，表示得分所占評分條的百分比。通過將文字和評分條結合，我們就可以快速的展示數據。以上就是CSS表格評分的基本設置。可以在表格外面再套上一個div實現橫向滾動。