CSS怎樣在圖片上加字？ 如果你想在圖片上添加字，CSS提供了一些方法可以幫助你實現這個效果。在這篇文章中，我們將向你介紹如何使用CSS在圖片上加字。 首先，我們需要HTML頁面中包含一個圖片元素。在這個例子中，我們將使用一個img標簽：

<img src="example.jpg" alt="Example Image">

現在我們就可以在這張圖片上加字了。接下來，我們可以使用CSS的position和z-index屬性來將文字放在圖片上方。

<style>
img {
position: relative;
z-index: 1;
}
img::after {
content: "這里是文字";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 2;
}
</style>

在上面的代碼中，我們使用CSS的偽元素::after來添加文字。我們將它的position屬性設置為absolute，這樣它可以相對于相對定位的父元素進行定位。我們使用top和left屬性將文字定位到了圖片的中心位置。我們也可以使用其他的定位方式，如top: 0; left: 0;來將文字放在圖片的左上角。 我們還使用transform屬性來將文字垂直和水平居中。我們使用translate來將元素上下移動50%，左右移動50%。這樣，當圖片的大小發生變化時，文字也會一直居中。 最后，我們設置z-index屬性使文字顯示在圖片上方。我們將img的z-index設為1，將文字的z-index設為2。 以上就是CSS怎樣在圖片上加字的方法，希望這篇文章能幫助你實現你的設計需求。