CSS上下排序按鈕，即向上和向下箭頭按鈕，是一種常見的網頁設計元素，它可以用于管理列表、表格等需要進行排序的數據。

/* CSS代碼如下： */
.button {
display: inline-block;
width: 24px;
height: 24px;
cursor: pointer;
background-repeat: no-repeat;
}
/* 向上按鈕 */
.up {
background-image: url("up.png");
}
/* 向下按鈕 */
.down {
background-image: url("down.png");
}

以上CSS代碼定義了一個.button類，該類設置了按鈕的基本屬性。.up和.down類分別應用于向上和向下箭頭按鈕，它們定義了按鈕的背景圖片。

在HTML頁面中，可以通過引入以上CSS代碼和使用.button、.up和.down類，來添加上下排序按鈕。例如：

<table>
<thead>
<tr>
<th>姓名</th>
<th>年齡</th>
<th>性別</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr>
<td>張三</td>
<td>25</td>
<td>男</td>
<td><div class="button up"></div> <div class="button down"></div></td>
</tr>
<tr>
<td>李四</td>
<td>30</td>
<td>女</td>
<td><div class="button up"></div> <div class="button down"></div></td>
</tr>
</tbody>
</table>

以上HTML代碼演示了在表格中添加上下排序按鈕的例子。在操作列中，使用

使用CSS上下排序按鈕可以讓數據表格更加易于管理，體現了網站的用戶友好性。