在前端開發中，CSS 是一個非常重要的語言，它可以用來控制網頁的樣式和布局。在本篇文章中，我們將探討如何使用 CSS 來制作一個簡單的矩形。

div {
width: 200px;
height: 100px;
background-color: black;
}

首先，我們需要使用 HTML 中的 div 標簽來創建一個容器，它將作為我們的矩形的主要內容。在這個 div 中，我們可以添加任何我們想要的內容（比如文本或圖片），并使用 CSS 控制它們的樣式和布局。

下一步是使用 CSS 來控制這個 div 的樣式。我們可以通過為 div 設置寬度和高度來控制矩形的大小。此外，我們可以使用 background-color 屬性來設置矩形的顏色。

最終，我們得到了一個簡單的矩形，它看起來如下所示：

當然，我們還可以通過添加其他 CSS 屬性來進一步控制矩形的樣式和布局。例如，我們可以使用 border-radius 屬性來使邊角變得更加圓潤。

div {
width: 200px;
height: 100px;
background-color: black;
border-radius: 10px;
}

現在，我們得到了一個更加漂亮的矩形，它看起來如下所示：

總的來說，利用 CSS 制作矩形是一個非常基礎的操作，但是它可以幫助我們更好地理解 CSS 的使用方式，從而為我們在實際開發中的樣式布局打下堅實的基礎。