容器，給容器賦予一個相對定位的position樣式，讓其成為文字絕對定位的父容器。

<div class="img-container">
	<img src="example.jpg">
	<p class="img-text">示例文字</p>
</div>

接下來，我們對絕對定位的文本容器加入底部對齊的CSS樣式。我們使用bottom:0和left:0將文本放在圖片的底部左側(cè)；并使用width:100%自適應(yīng)父容器的寬度；使用background-color:rgba(x,x,x,x)來填充背景顏色，其中顏色數(shù)值可以根據(jù)需要調(diào)整；使用color樣式設(shè)定字體顏色和大小等，如下：

.img-text {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	background-color: rgba(0, 0, 0, 0.6);
	color: white;
	font-size: 16px;
	padding: 5px;
	box-sizing: border-box;
	margin: 0;
}

最終，我們通過HTML和CSS的配合，成功實現(xiàn)了圖片底部對齊的效果。開發(fā)者可以根據(jù)需要，自己調(diào)整文本容器和文本樣式的大小、顏色和位置。