CSS中的button元素是非常常用的，但很多時候我們需要將button的底部居中，這可能會讓一些初學者感到困惑。下面我們來一起看一下該如何實現這個效果。

首先，在HTML中我們需要寫一個button元素：

<button>點擊我</button>

接著，在CSS中我們需要給這個button設置一些樣式，比如width和height。同時，我們需要將button所在的容器（通常是一個div）的position設置為relative：

div {
position: relative;
}
button {
width: 100px;
height: 50px;
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
}

這里我們主要要關注的是button的樣式。我們將button的position設置為absolute，然后將其bottom設置為0，這樣就可以將button置于容器的底部。接著我們將button的left設置為50%，這意味著button的左邊緣會在容器的中心位置。但是，此時button的位置并不是我們想要的，因此我們需要使用transform屬性對其進行微調。在這里，我們使用translateX(-50%)將button向左平移了它自身寬度的一半，這樣button就會水平居中了。

最后就是添加一些樣式來美化button：

button {
width: 100px;
height: 50px;
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
background-color: #4CAF50;
color: white;
border: none;
border-radius: 5px;
font-size: 16px;
}

這里我們添加了一些樣式來美化button，比如背景色、邊框、圓角等等。這個button現在看起來應該是非常漂亮的，而且底部也居中了。