html中怎么写正六边形,利用css3书写正6边形

1.倾斜正六边形

#box{

width: 200px;height: 250px;

transform: rotate(30deg);

}

.con-show01{width: 200px;height: 250px;float: left;margin-left: 10px;overflow: hidden;transform:rotate(120deg);}

.con-show02{width: 100%;height: 100%;overflow: hidden;transform:rotate(-60deg);}

.con-show03{width: 100%;height: 100%;overflow: hidden;transform:rotate(-60deg);position: relative;background: pink;}

2.正六边形

Document

.con-show01{width: 200px;height: 250px;float: left;margin-left: 10px;overflow: hidden;transform:rotate(120deg);}

.con-show02{width: 100%;height: 100%;overflow: hidden;transform:rotate(-60deg);}

.con-show03{width: 100%;height: 100%;overflow: hidden;transform:rotate(-60deg);position: relative;background: pink;}