0
点赞
收藏
分享

微信扫一扫

[CSS3] 绘制六边形

桑二小姐 2022-12-21 阅读 95


[CSS3] 绘制六边形_css

#hexagon {  
width: 100px;
height: 55px;
background: red;
position: relative;
}
#hexagon:before {
content: "";
position: absolute;
top: -25px;
left: 0;
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-bottom: 25px solid red;
}
#hexagon:after {
content: "";
position: absolute;
bottom: -25px;
left: 0;
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-top: 25px solid red;
}

参考:

​​CSS3—绘制六边形​​


举报

相关推荐

css3 六边形

六边形绘制

turtle六边形绘制

六边形架构

Java、六边形面积

旋转的六边形

【页面】3D六边形

海龟画图无限彩虹六边形

0 条评论