正方形是一種常見的幾何形狀，其四邊長度相等，四個角都為直角。在網頁設計中，我們經常需要將正方形進行美化，其中一種方法就是將正方形變成圓形。在CSS中，可以通過border-radius屬性實現這一效果。

下面的CSS代碼演示了如何將正方形用CSS變成圓形：

.square {
width: 100px;
height: 100px;
background-color: #ccc;
border-radius: 50%;
}

代碼中定義了一個名為square的類，寬度和高度都為100像素，背景顏色為灰色。關鍵的一行是border-radius: 50%。這一行將正方形的四個角弧度設置為50%的寬度，即半徑為正方形寬（或高）度的一半，這樣就形成了一個圓形。

需要注意的是，border-radius屬性也可以指定四個角的弧度，例如：

.square {
width: 100px;
height: 100px;
background-color: #ccc;
border-top-left-radius: 50px;
border-top-right-radius: 20px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 30px;
}

這段代碼將正方形的四個角分別指定了不同的弧度，可以得到一種異形的效果。使用border-radius屬性，可以讓我們的網頁設計更加多樣化，同時也可以提高用戶體驗。