當(dāng)我們在網(wǎng)頁中插入圖片時，一般都需要控制圖片的大小來適配頁面布局和優(yōu)化加載速度。CSS提供了多種方式可以設(shè)置圖片大小。其中最常用的是通過設(shè)置元素的width和height屬性來控制大小。

例如，我們可以設(shè)置一個圖片元素的寬度為200像素，高度則根據(jù)圖片的實際比例自動調(diào)整：

<img src="example.jpg" alt="example" style="width: 200px; height: auto;">

另一種常見的控制圖片大小的方式是設(shè)置父元素的寬度，然后讓圖片元素自適應(yīng)。這種方法適合于響應(yīng)式設(shè)計，可以使圖片在移動端和桌面端大小適配。

<div style="width: 100%; max-width: 800px;">
<img src="example.jpg" alt="example" style="max-width: 100%; height: auto;">
</div>

此外，CSS還提供了一種讓圖片呈現(xiàn)圓形的方法。我們可以利用CSS的border-radius屬性來實現(xiàn)。把元素的border-radius屬性設(shè)置為50%，就可以將元素變成圓形。將具有圓形邊框的元素的寬度和高度設(shè)置為相同的值，就可以得到一個完美的圓形。

<img src="example.jpg" alt="example" style="width: 200px; height: 200px; border-radius: 50%;">

在使用border-radius屬性時，我們還可以設(shè)置不同的值來得到不同形狀的邊框。通過設(shè)置border-radius的四個值，我們可以得到一個具有橢圓形或者四個角都為圓角的元素。例如：

<div style="width: 200px; height: 100px; border-radius: 20px 0 0 20px; background-color: pink;"></div>

上述代碼將會得到一個左側(cè)為圓角，右側(cè)為直角的粉色矩形元素。