翻頁按鈕是網頁設計中常用的重要組件之一。通過添加合適的CSS樣式可以讓翻頁按鈕更加美觀、易于使用。下面介紹幾種常見的翻頁按鈕CSS樣式。

/*1.基本樣式*/
.page {
display: inline-block;
padding: 4px 8px;
font-size: 14px;
font-weight: bold;
color: #333;
background-color: #fff;
border: 1px solid #ccc;
border-radius: 4px;
cursor: pointer;
}
/*2.鼠標懸停樣式*/
.page:hover {
color: #fff;
background-color: #4582ec;
border-color: #4582ec;
}
/*3.當前頁樣式*/
.page.active {
color: #fff;
background-color: #4582ec;
border-color: #4582ec;
cursor: default;
}
/*4.禁用樣式*/
.page.disabled {
color: #999;
background-color: #eee;
border-color: #ccc;
cursor: not-allowed;
}

以上是常見的翻頁按鈕樣式代碼，根據實際情況可進行適當的修改調整。在使用時，可以結合JavaScript實現翻頁功能，讓按鈕呈現良好的用戶體驗。