在網頁設計中，經常會用到按鈕來進行用戶交互。然而，想要讓按鈕居中顯示卻是一件棘手的事情。本文將介紹如何利用CSS讓div按鈕居中顯示。

首先，在HTML中創建一個button div，并給它添加一個class。這個class將會在CSS中被調用。

<div class="button">按鈕</div>

接下來，在CSS中，我們需要定義這個class的寬度、高度、背景顏色、邊框、填充和字體顏色等屬性。在這個例子中，我們將寬度設置為120像素，高度設置為50像素，背景顏色為藍色，邊框為1像素實線的黑色邊框，填充為10像素，字體顏色為白色。

.button {
width: 120px;
height: 50px;
background-color: blue;
border: 1px solid black;
padding: 10px;
color: white;
}

我們接下來要讓這個按鈕居中顯示。有幾種方法可以實現這個目標。這里我們介紹兩種方法。

第一種方法是使用text-align屬性。我們可以在父元素中使用text-align:center，把子元素居中。在這個例子中，我們把button div放在body里，所以我們需要在CSS中添加以下樣式：

body {
text-align: center;
}

第二種方法是使用margin屬性。我們可以把button div的左右邊距都設置為auto，這樣就會居中顯示。在這個例子中，我們在CSS中添加以下樣式：

.button {
width: 120px;
height: 50px;
background-color: blue;
border: 1px solid black;
padding: 10px;
color: white;
margin: auto;
}

利用text-align和margin這兩種方法，我們可以很容易地讓div按鈕居中顯示。如果你有其他關于按鈕居中的方法和技巧，歡迎在評論區分享。