CSS讓文字居于圖片底部的方法

在CSS中，我們可以使用相對定位（relative positioning）和***定位（absolute positioning）來實(shí)現(xiàn)文字居于圖片底部的效果，相對定位是指將元素相對于其正常位置進(jìn)行定位，而***定位則是將元素相對于瀏覽器窗口進(jìn)行定位。

我們需要將圖片設(shè)置為相對定位的元素，然后將文字設(shè)置為***定位的元素，這樣，我們就可以通過調(diào)整圖片和文字的top屬性來讓文字居于圖片底部。

假設(shè)我們有一個圖片元素和一個文字元素，它們的HTML代碼如下：

<img id="myImage" src="image.jpg" style="position: relative;">
<div id="myText" style="position: absolute; top: 0;">這是一段文字</div>

我們可以通過CSS來調(diào)整它們的top屬性，以實(shí)現(xiàn)文字居于圖片底部的效果：

#myImage {
  height: 200px; /* 圖片的高度可以根據(jù)需要調(diào)整 */
}
#myText {
  top: 200px; /* 文字距離頂部的距離等于圖片的高度 */
}

這樣，文字就會出現(xiàn)在圖片的底部，并且與圖片保持一定的距離，如果需要調(diào)整文字與圖片的距離，只需要調(diào)整top屬性的值即可。