在網頁設計中，插入圖片是不可或缺的一部分，使用CSS（級聯樣式表）可以輕松地將圖片插入到頁面中，并控制其樣式和布局，下面是一些關于如何使用CSS插入頁面圖片的方法。

1、使用img元素：在HTML中，使用<img>元素可以插入圖片，通過CSS，我們可以設置圖片的樣式，如寬度、高度、邊框等。

<img src="image.jpg" alt="示例圖片" style="width: 200px; height: 100px; border: 1px solid black;">

2、使用背景圖片：CSS的background-image屬性可以將圖片作為元素的背景，將圖片設置為某個元素的背景：

div {
    background-image: url('image.jpg');
    background-size: cover; /* 圖片覆蓋整個元素區(qū)域 */
}

3、圖片列表：如果頁面中有多個圖片，可以使用CSS的list-style-image屬性為列表項設置圖片。

ul {
    list-style-image: url('image1.png');
}
li {
    list-style-image: url('image2.png');
}

4、使用偽元素：CSS的偽元素（如::before和::after）可以用來在元素的內容前后插入圖片。

div::before {
    content: url('image.jpg');
}

5、圖片輪播：使用CSS的animation和@keyframes可以創(chuàng)建圖片輪播效果。

@keyframes image-rotation {
    0% { background-image: url('image1.jpg'); }
    50% { background-image: url('image2.jpg'); }
    100% { background-image: url('image1.jpg'); }
}
div {
    animation: image-rotation 5s infinite;
}

這些方法可以幫助你在頁面中靈活地插入和樣式化圖片，提升網頁的視覺效果和用戶體驗。