網頁設計中，有時需要將一張圖片浮在另一張圖片上，這種效果可以采用CSS來實現。在下面的代碼中，我們可以使用position:absolute;將需要浮動的圖片定位到我們想要的位置，再使用z-index:來控制顯示順序。

<div class="container">
<img src="image-1.jpg" alt="圖片1">
<img class="floating-img" src="image-2.jpg" alt="圖片2">
</div>
<style>
.container {
position: relative;
}
.floating-img {
position: absolute;
top: 50px;
left: 50px;
z-index: 1;
}
</style>

在上面的代碼中，我們將兩張圖片放在一個container的容器中，并將容器的position設置為relative。在需要浮動的圖片中，我們設置了position為absolute，并指定了top和left來控制位置。最后，通過z-index來設定圖片的顯示順序，越大的值越會顯示在最上層。

需要注意的是，如果需要在多個元素中使用浮動圖片，需要確保每個元素的容器position為relative，才能正確控制圖片位置。

上面的CSS浮動圖片效果代碼，是一個基礎的實現方法，如果需要更加復雜的效果，可以根據需求進行更改。如，可以添加CSS過渡效果，來實現圖片漸變浮動的效果；也可以通過JavaScript動態設置圖片位置，實現更加靈活的效果。