在網頁設計中，經常需要使用圖片來豐富頁面效果，而有時我們需要將圖片變成圓形，以達到更好的美觀效果。那么在CSS中如何實現呢？下面我們一起來看看。

首先我們需要使用CSS選擇器來選中圖片，并設置其形狀為圓形。這里我們使用border-radius屬性設置其半徑為50%，即可完成圓形效果。

img {
border-radius: 50%;
}

上述代碼將所有圖片設置為圓形，但如果有多張圖片，我們需要分別設置時，可以在其class或id屬性中添加樣式。

.avatar {
border-radius: 50%;
}

上述代碼將class屬性為avatar的圖片設置為圓形，實現單獨設置。

除了使用CSS屬性設置外，也可以使用背景圖片來實現圓形效果。此時我們需要使用background屬性，其中background-image為要使用的圖片，而background-size設置為cover或100% 100%，表示通過尺寸調整圖片大小與容器相同。

.avatar {
background-image: url("avatar.jpg");
background-size: cover;
border-radius: 50%;
}

上述代碼中，我們使用了class為avatar的div元素來展示圓形圖片效果，把圖片作為該div元素的背景，實現圓形展示。

總之，在CSS中想要實現圓形圖片是非常簡單的，只需使用border-radius屬性或background-image屬性即可。