文章内容
1、HTML
<div class="photo">
<img src=""/>
</div>
2、CSS
photo {
width: 200px;
height: 200px;
background: #6c00af;
-webkit-clip-path: polygon(
28% 6%,
71% 15%,
100% 75%,
18% 39%,
63% 27%,
16% 22%,
65% 19%
);
clip-path: polygon(
28% 6%,
71% 15%,
100% 75%,
18% 39%,
63% 27%,
16% 22%,
65% 19%
);
}
3、计算工具
CSS Clip-Path生成器:https://tool.ntan520.com/tool/clippy/clippy.html