在CSS中,您可以使用相對(duì)定位或***定位來在圖片上再加圖片,相對(duì)定位是相對(duì)于當(dāng)前元素進(jìn)行定位,而***定位則是相對(duì)于瀏覽器窗口進(jìn)行定位。
您需要在HTML中創(chuàng)建兩個(gè)圖片元素,分別設(shè)置它們的id和class屬性,以便在CSS中進(jìn)行定位。
<img id="image1" src="image1.png" /> <img id="image2" src="image2.png" />
在CSS中設(shè)置***個(gè)圖片元素的相對(duì)定位,并將第二個(gè)圖片元素設(shè)置為***定位。
#image1 { position: relative; } #image2 { position: absolute; top: 0; left: 0; }
在這個(gè)例子中,第二個(gè)圖片元素將相對(duì)于***個(gè)圖片元素的左上角進(jìn)行定位,您可以根據(jù)需要調(diào)整top和left屬性來更改第二個(gè)圖片元素的位置。
這種方法僅適用于CSS3及更高版本,如果您使用的是較舊的瀏覽器,可能需要使用其他方法來實(shí)現(xiàn)圖片疊加效果。