CSS3中提供了一種繪制多邊形邊框的方法，可以用來(lái)制作一些有趣的圖案、邊框樣式等。使用border屬性，配合border-radius和transform實(shí)現(xiàn)。

.box{
width: 200px;
height: 200px;
border: 20px solid transparent;
border-top-color: red;
border-right-color: green;
border-bottom-color: blue;
border-left-color: yellow;
border-radius: 50%;
transform: rotate(45deg);
}

上述代碼實(shí)現(xiàn)了一個(gè)正方形的四面邊框，每個(gè)邊框顏色不同，同時(shí)添加了圓角和旋轉(zhuǎn)效果，形成了一個(gè)彩色的八邊形。

.box{
width: 0;
height: 0;
border: 50px solid transparent;
border-bottom-color: red;
border-right-color: blue;
border-top-color: green;
border-left-color: yellow;
}

上述代碼實(shí)現(xiàn)了一個(gè)菱形效果，通過(guò)設(shè)置寬高為0，邊框?qū)挾葹?0px，邊框顏色不同來(lái)實(shí)現(xiàn)，該方法還可以實(shí)現(xiàn)三角形、梯形等效果。 需要注意的是，在使用多邊形邊框時(shí)，需要清楚自己所需要的邊數(shù)和邊的長(zhǎng)度比例，才可以正確的繪制出多邊形效果。同時(shí)，通過(guò)設(shè)置不同顏色的邊框，可以實(shí)現(xiàn)更多的樣式效果。