css实现五角形

CSS是网页设计中必不可少的重要技术，它可以实现许多炫酷的效果，比如我们今天要介绍的五角形。实现五角形主要依靠CSS3中的transform属性和border属性。下面是代码实现：

.pentagon{
    width: 0;
    height: 0;
    border: 50px solid transparent;
    border-bottom: 70px solid #FF574E;
    transform:rotate(36deg);      
    margin: 20px auto;
}

我们可以看到，首先定义了一个名为pentagon的class，接着设置其宽高均为0，边框样式设置为实心边框，颜色为透明。然后只设置底边为实心边框，颜色为#FF574E，这就是五角形的颜色。接着增加了一个旋转效果，使五边形旋转36度（360/5），最后设置了一个居中显示的margin属性。

这样就实现了一个漂亮的五角形。当然，如果你想要更改五角形的大小或颜色，只需要修改代码中的数值即可。