CSS是一種強大的樣式表語言，可以控制HTML文檔中的各種元素。其中，通過設(shè)置圖片的形狀可以讓圖片更具有吸引力和藝術(shù)價值。讓我們來看看如何使用CSS設(shè)置圖片形狀吧！

img {
border-radius: 50%;  /* 設(shè)置圓形 */
clip-path: polygon(0 0, 100% 0, 100% 90%, 0 100%);  /* 設(shè)置菱形 */
shape-outside: circle(50% at 50% 50%);  /* 設(shè)置環(huán)形 */
}

上面的代碼使用不同的CSS屬性來設(shè)置不同的圖片形狀。下面分別詳細介紹。

1. 圓形

要設(shè)置一個圓形的圖片，我們可以使用border-radius屬性，將元素的邊框半徑設(shè)置為50%。這將使元素的四個角變成圓形，從而創(chuàng)建一個圓形的圖片。

img {
border-radius: 50%;  
}

2. 菱形

要設(shè)置一個菱形的圖片，我們可以使用clip-path屬性和多邊形函數(shù)，來裁剪圖片的形狀。下面的代碼將圖片裁剪成一個菱形：頂部和底部的端點坐標分別為（0,0）和（0,100%），而左側(cè)和右側(cè)的端點分別為（100%，0）和（100%，90%）。

img {
clip-path: polygon(0 0, 100% 0, 100% 90%, 0 100%);
}

3. 環(huán)形

要設(shè)置一個環(huán)形的圖片，我們可以使用shape-outside屬性和circle()函數(shù)，來定義圖片的形狀。下面的代碼將創(chuàng)建一個環(huán)形的圖片：其中心坐標為（50%，50%），半徑為50%。

img {
shape-outside: circle(50% at 50% 50%);
}

總之，使用CSS可以輕松地為圖片創(chuàng)建不同形狀。使用border-radius屬性、clip-path屬性和多邊形函數(shù)、shape-outside屬性和形狀函數(shù)，即可輕松實現(xiàn)各種想象中的圖片形狀。