在前端開發(fā)中，我們經(jīng)常會遇到需要把小圖放到大圖上的需求，比如需要在一個頭像上顯示一個徽章或者標(biāo)簽。這時候我們可以使用CSS來實現(xiàn)這一功能。

.big-image{
position: relative;
display: inline-block;
}
.small-image{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

首先，我們需要給大圖的容器設(shè)置相對定位（position: relative;），然后把小圖的定位方式設(shè)為絕對定位（position: absolute;）。接著，我們可以使用top和left屬性來控制小圖的位置，以及使用transform來讓它水平和垂直居中（transform: translate(-50%, -50%);）。

完整的HTML和CSS代碼如下：

<div class="big-image">
<img src="big-image.jpg">
<img class="small-image" src="small-image.png">
</div>
.big-image{
position: relative;
display: inline-block;
}
.small-image{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

通過以上代碼，我們可以把小圖放到大圖的任何位置，并且不會影響大圖的其他內(nèi)容。