CSS中的按鈕是Web開發中必不可少的一部分，它可以使用戶界面看起來更加美觀和交互性強。但是，將按鈕在頁面中居中顯示并不那么容易。下面是三種常見的CSS按鈕居中方法：

/*方法一：使用text-align屬性*/
.center {
text-align: center;
}
/*方法二：使用margin屬性*/
.center {
margin: auto;
}
/*方法三：使用定位屬性*/
.center {
position: relative;
left: 50%;
transform: translateX(-50%);
}

以上CSS代碼可以使按鈕水平居中，但垂直方向的居中需要更多的操作。以下是兩種常見的方法：

/*方法一：使用display和line-height屬性*/
.center {
display: inline-block;
line-height: 60px; /*60px是按鈕高度*/
vertical-align: middle;
}
/*方法二：使用flexbox布局*/
.container {
display: flex;
align-items: center; /*垂直方向居中*/
justify-content: center; /*水平方向居中*/
}
.center {
height: 60px; /*60px是按鈕高度*/
}

以上CSS代碼可以使按鈕在頁面中垂直和水平方向上都居中。根據實際情況選擇不同的居中方法可以有效地優化頁面布局效果。