CSS 是前端開發中不可缺少的一部分，而 CSS3 更是為開發人員帶來了更多的操作方式，其中包括插入圖片。下面將介紹常用的 CSS3 插入圖片的方式。

// HTML 代碼
<div class="box"></div>
// CSS 代碼
.box {
width: 200px;
height: 200px;
background-image: url("image.jpg");
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}

上述代碼會創建一個 200px x 200px 的盒子，并將一張名為 "image.jpg" 的圖片作為背景圖片插入到盒子中，背景大小被設置為 cover，位置居中，不重復。在實際開發中，應該將 "image.jpg" 替換為需要插入的圖片文件名，并根據需要調整圖片的大小及位置。

CSS3 還提供了一種插入圖片的方式——作為元素插入。下面是代碼示例：

// HTML 代碼
<div class="box"><img src="image.jpg" alt="圖片"></div>
// CSS 代碼
.box {
width: 200px;
height: 200px;
}
.box img {
width: 100%;
height: 100%;
border-radius: 50%;
}

上述代碼會創建一個 200px x 200px 的盒子，并將一張名為 "image.jpg" 的圖片作為子元素插入到盒子中。使用 CSS3 的邊框屬性 "border-radius" 將圖片設置為圓形，并根據需要調整圖片的大小。這種方式可以讓圖片更加突出，但也會增加 HTML 代碼的復雜度。

總之，CSS3 提供了豐富的插入圖片的方式，開發人員可以根據需要選擇最適合自己的方式，增強頁面的視覺效果。