CSS 可以讓我們寫出各種不同的形狀和樣式。其中寫多邊形也是一件很有意思的事情。

.selector {
width: 0;
height: 0;
border-top: 50px solid transparent;
border-left: 100px solid red;
border-right: 50px solid transparent;
border-bottom: 50px solid red;
}

上面的代碼可以讓我們生成一個(gè)向右傾斜的等腰三角形。其中，width和height屬性用來(lái)控制三角形的大小，border屬性中的四個(gè)值代表四個(gè)邊框的樣式和顏色，通過(guò)控制它們的寬度和顏色就可以得到不同形狀的多邊形。

還可以使用clip-path屬性控制元素的裁剪形狀，示例如下：

.selector {
background: green;
width: 200px;
height: 200px;
-webkit-clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
}

這段代碼可以讓元素變成一個(gè)凸多邊形。其中，background屬性用來(lái)設(shè)置元素背景顏色，-webkit-clip-path和clip-path屬性用來(lái)設(shè)置裁剪路徑，polygon函數(shù)用來(lái)創(chuàng)建多邊形。

以上就是用 CSS 寫多邊形的簡(jiǎn)單介紹，希望對(duì)你有所幫助！