在CSS中，我們可以使用多種方法將圖片居中顯示在div中，以下是幾種常用的方法：

1、使用flexbox布局：

Flexbox是一種現(xiàn)代的CSS布局模式，可以輕松地實(shí)現(xiàn)元素的居中對齊，我們可以將div設(shè)置為flex容器，并使用justify-content和align-items屬性來分別控制水平和垂直對齊。

```css

.div-with-image {

display: flex;

justify-content: center;

align-items: center;

}

```

2、使用grid布局：

Grid布局也是實(shí)現(xiàn)元素居中的好方法，我們可以將div設(shè)置為grid容器，并使用justify-content和align-items屬性來控制水平和垂直對齊。

```css

.div-with-image {

display: grid;

justify-content: center;

align-items: center;

}

```

3、使用text-align屬性：

對于單行文本或圖片，我們可以使用text-align屬性來控制其在div中的水平對齊。

```css

.div-with-image {

text-align: center;

}

```

4、使用margin屬性：

通過計(jì)算div的寬度和圖片的寬度，我們可以設(shè)置適當(dāng)?shù)膍argin來實(shí)現(xiàn)圖片的居中顯示。

```css

.div-with-image {

width: 300px; /* 假設(shè)div的寬度為300px */

}

.div-with-image img {

width: 200px; /* 假設(shè)圖片的寬度為200px */

margin-left: 50px; /* 計(jì)算margin， (300 - 200) / 2 = 50 */

}

```

5、使用transform屬性：

通過計(jì)算div的寬度和圖片的寬度，我們可以使用transform屬性來移動(dòng)圖片到正確的位置。

```css

.div-with-image {

width: 300px; /* 假設(shè)div的寬度為300px */

}

.div-with-image img {

width: 200px; /* 假設(shè)圖片的寬度為200px */

transform: translateX(-50px); /* 計(jì)算translate值， (300 - 200) / 2 = -50 */

}

```

是幾種常見的將圖片居中顯示在div中的CSS方法，你可以根據(jù)自己的需求和布局選擇***適合的方法。