在網頁設計中，按鈕是非常常見的一個元素。而固定按鈕在頁面的尾部也是比較常見的設計需求，可以幫助用戶快速找到操作按鈕，在頁面末尾增加操作的便利性。這里我們將學習如何使用 CSS 將按鈕固定在頁面底部。

.footer-btn {
position: fixed;
bottom: 0;
left: 50%;
transform: translateX(-50%);
}
.footer {
padding-bottom: 50px; /* 為按鈕留出位置 */
}

首先，我們需要為按鈕設置固定的位置。通過設置position: fixed;讓按鈕不隨頁面滾動而移動，并通過bottom: 0;使其位于頁面底部。

由于按鈕在頁面底部，我們可以通過設置其left: 50%;和transform: translateX(-50%);讓其水平居中。通過這樣的方式，按鈕將會在各種屏幕大小和分辨率下表現良好。

另外，我們需要在頁面底部留出足夠的位置給按鈕。通過在頁面底部的容器元素.footer中設置padding-bottom: 50px;，我們可以為按鈕騰出 50 像素的空間。

通過上述步驟，我們可以輕松地將按鈕固定在頁面底部，并保證在不同設備和不同尺寸的屏幕上的表現一致。使用 CSS，我們可以實現各種優秀的網頁設計。