CSS可以幫助我們實現很多成果，特別是在圖片處理方面。我們可以使用CSS將矩形的圖片變成圓形的，來達到更好的視覺效果。

趕快看下面的代碼吧！

img {
border-radius: 50%;
}

是不是很簡單？我們只需要在對應的元素設置border-radius為50%，就可以將矩形圖片變成圓形圖片了。

如果想要圖片大小不變，我們可以加上max-width和max-height屬性：

img {
border-radius: 50%;
max-width: 100%;
max-height: 100%;
}

你還可以通過position和transform屬性來實現圖片放大和縮小的效果：

.img-container {
position: relative;
overflow: hidden;
width: 200px;
height: 200px;
}
.img-container img {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%) scale(1.2);
border-radius: 50%;
max-width: 100%;
max-height: 100%;
transition: transform 0.2s ease;
}
.img-container img:hover {
transform: translate(-50%, -50%) scale(1.5);
}

在代碼中，我們使用了img-container這個容器將圖片包起來，然后設置overflow為hidden，將多余的部分隱藏起來。

圖片設置了position:absolute屬性，并且使用了translate(-50%, -50%)的屬性值，將圖片在容器中垂直方向和水平方向均居中。同時也設置了transform:scale(1.2)，將圖片放大1.2倍。

接著我們又設置了一個:hover的狀態，當我們懸停在圖片上的時候，就會執行transform:scale(1.5)，將圖片放大到1.5倍。

以上就是CSS將圖片轉圓形的方法，還有更多的圖片處理方式，等著你去探索吧！