CSS可以幫助我們控制圖片的底部對齊，讓頁面展現更加協調美觀。下面就來介紹幾種控制圖片底部對齊的方法。

一、使用vertical-align屬性：

img {
vertical-align: middle; /*使圖片在文本行的中間對齊*/
}

二、使用display屬性：

.container {
height: 200px; /*設置容器高度*/
display: flex; /*啟用flex布局*/
align-items: flex-end; /*容器內部元素向底部對齊*/
}
img {
height: 100px; /*設置圖片高度*/
margin: auto; /*使圖片水平居中*/
}

三、使用position屬性：

.container {
height: 200px; /*設置容器高度*/
position: relative; /*設置相對定位*/
}
img {
position: absolute; /*設置絕對定位*/
bottom: 0; /*將圖片定位到容器底部*/
left: 50%; /*使圖片水平居中*/
transform: translateX(-50%); /*調整位置*/
}

以上三種方法都可以控制圖片底部對齊，根據頁面布局和需求，選擇合適的方法即可。