在網(wǎng)頁(yè)中，有時(shí)候我們需要對(duì)圖片進(jìn)行精確的位置控制，而在CSS中，我們可以通過(guò)設(shè)置img標(biāo)簽的樣式來(lái)實(shí)現(xiàn)這個(gè)目的。

在樣式中，我們可以使用屬性“position”來(lái)指定圖片的定位方式，常見(jiàn)的定位方式有如下三種：

position: static; // 默認(rèn)定位方式，圖片按照正常文檔流方式排列
position: relative; // 相對(duì)定位，可以通過(guò)top、bottom、left、right屬性進(jìn)行微調(diào)
position: absolute; // 絕對(duì)定位，圖片的位置與最近的非static定位的父元素有關(guān)，也可以通過(guò)top、bottom、left、right屬性進(jìn)行微調(diào)

除了定位方式外，我們還可以使用“z-index”屬性來(lái)指定圖片的層級(jí)，值越大越在上層，這對(duì)于多張圖片疊加顯示時(shí)非常有用。

以下是一個(gè)使用絕對(duì)定位和z-index屬性控制圖片位置和層級(jí)的例子：

<div style="position: relative;">
<img src="./img1.jpg" style="position: absolute; top: 20px; left: 20px; z-index: 2;" />
<img src="./img2.jpg" style="position: absolute; top: 50px; left: 50px; z-index: 1;" />
</div>

在這個(gè)例子中，兩張圖片都在一個(gè)相對(duì)定位的div容器中，但是它們使用絕對(duì)定位設(shè)置了不同的位置，同時(shí)也指定了z-index屬性，這樣就可以保證圖片的層級(jí)關(guān)系，讓它們按照指定的位置和層級(jí)被顯示。