在網頁設計中，通常需要將文字放置在圖片上方，以便更好地展示信息。這時候，就需要用到CSS技術來實現文字在圖片上的效果。

/* CSS代碼 */
.container {
position: relative; /* 設置容器為相對定位 */
display: inline-block; /* 將容器設置為行內塊元素 */
}
.container img {
display: block; /* 將圖片設置為塊元素 */
width: 100%; /* 設置圖片寬度為100% */
}
.container p {
position: absolute; /* 設置文本絕對定位 */
top: 50%; /* 將文本距離容器頂部50% */
left: 50%; /* 將文本距離容器左邊50% */
transform: translate(-50%, -50%); /* 使用transform屬性使文本水平垂直居中 */
}

上面的CSS代碼中，我們首先將容器設置為相對定位，并將圖片設置為塊元素。接著，我們將要放置的文字使用絕對定位的方式放置在容器中，并使用top: 50%和left: 50%屬性將其水平垂直居中。最后，使用transform: translate(-50%, -50%)屬性微調文本的位置，使其與圖片對齊。

除了以上的方法，還可以使用CSS3中的background-image實現文字在圖片上方的效果。具體實現方法請參考相關資料。