CSS3是前端開發中最常用的技術之一，它可以讓網站更加美觀和互動。在CSS3中，矩形和三角形是兩個開發者最常用的形狀，下面我們將詳細講述如何在CSS3中使用矩形和三角形。 首先，讓我們來看一下如何在CSS3中創建矩形。通過使用border-radius屬性，我們可以將一個矩形改為一個圓角矩形。例如：

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

以上代碼將創建一個200像素寬，100像素高的圓角矩形。border-radius的值表示矩形的角的曲率。如果我們將其設置為0，則會創建一個普通的矩形。 接下來，我們來學習如何在CSS3中創建三角形。我們可以使用border屬性為一個元素指定三角形的邊框。例如：

div {
width: 0;
height: 0;
border-top: 50px solid green;
border-right: 50px solid transparent;
border-left: 50px solid transparent;
}

以上代碼將創建一個向下的等邊三角形。我們需要將div的寬度和高度設置為0，然后使用border-top屬性指定三角形的高度和顏色，并使用border-right和border-left屬性指定三角形的兩邊的寬度，同時將其中一邊設置為透明。 也可以通過旋轉一個矩形來創建一個三角形，如下：

div {
width: 0;
height: 0;
border-top: 50px solid green;
border-right: 50px solid transparent;
transform: rotate(45deg);
}

以上代碼將創建一個向右上角的三角形。我們需要將div寬度和高度設置為0，然后使用border-top屬性指定三角形的高度和顏色，使用border-right屬性指定三角形的右側寬度，同時使用transform屬性將矩形旋轉45度。 在CSS3中，使用矩形和三角形可以讓網頁變得更加美觀和互動。通過掌握這些簡單的技巧，我們可以為我們的網站增添一些獨特的設計。