第一個案例是將一個容器<div>固定在頁面底部：
.dibu {
position: fixed;
bottom: 0;
width: 100%;
}在這個案例中，設置<div class="dibu">的position屬性為fixed，將其固定在頁面底部。通過bottom屬性可以控制它與頁面底部的距離，這里設置為0，表示貼緊底部。width屬性設置為100%，使容器寬度與頁面寬度一致，充滿整個頁面。通過這些CSS樣式，我們可以創建一個固定在底部的容器。
第二個案例是將一個容器<div>居中對齊于頁面底部：
.dibu {
position: fixed;
bottom: 0;
left: 50%;
transform: translateX(-50%);
}在這個案例中，除了設置<div class="dibu">的position和bottom屬性外，還設置了left、transform屬性。通過left屬性將容器的左側偏移設置為50%，使其水平居中對齊于頁面。而通過transform屬性的translateX(-50%)設置，可以將容器自身寬度的一半向左平移，以此實現居中對齊的效果。通過這些CSS樣式，我們可以創建一個居中對齊于底部的容器。
第三個案例是將一組相鄰的元素平均分布在<div>容器底部：
.dibu {
display: flex;
justify-content: space-between;
align-items: center;
}在這個案例中，設置<div class="dibu">的display屬性為flex，使其成為一個flex容器。通過設置justify-content屬性為space-between，可以讓容器內的元素平均分布并貼近容器的兩側。而通過設置align-items屬性為center，可以將容器內的元素垂直居中對齊。通過這些CSS樣式，我們可以創建一個底部容器，將其中的元素平均分布。
除了以上的案例，<div class="dibu">還可以與其他CSS屬性和值結合使用，根據實際需求定制不同的底部樣式。在HTML/CSS開發中，合理使用類名能夠起到減少代碼重復、提高樣式復用性的作用，使代碼更加清晰和易于維護。
起來，<div class="dibu">是一個HTML/CSS類名，用于定義一個元素位于頁面底部的樣式。通過不同的CSS樣式設置，可以實現將一個容器固定在底部、居中對齊于底部、平均分布等效果。