居中显示：body{margin:0;高度：100vh；显示：弹性；对齐项目：居中；证明内容：居中；background:linear-gradient(gray,lightyellow,gray);}定义蝴蝶尺寸：.butterfly{position:relative;宽度：10em；height:10em;}先画左半边：.butterfly.left{position:absolute;宽度：继承；height:inherit;}使用第一个子元素绘制翅膀的上半部分：.butterflyspan{position:absolute;border-radius:50%;}.butterflyspan:nth-child(1){宽度：5e米;高度：7em；background-color:gold;}使用第二个子元素绘制翅膀的下半部分：.butterflyspan:nth-child(2){width:5.5em;高度：3.5em；背景颜色：橙红色；顶部：5em；左：-2.5em；filter:opacity(0.6);}使用第三个子元素绘制触手：.butterflyspan:nth-child(3){width:6em;高度：6em；border-right:0.3emsolidorangered;top:-0.5em;}将左半部分复制到右半部分：.butterfly.right{position:absolute;宽度：继承；height:inherit;}.butterfly.right{transform:rotateY(180deg)rotate(-90deg);顶部：0.4em；left:0.4em;}将标本放入展示框：.butterfly::before{content:'';位置：绝对；box-sizing:border-box;顶部：-2.5em；左：-8em；宽度：24em；高度：18em；背景色：黑色；border:0.2eminsetsilver;}.butterfly::after{content:'';框大小：边框框；宽度：40em；高度：30em；背景色：淡黄色；顶部：-9em；左：-16em；边框：2em实心木；边界半径：3em；盒子阴影：00.3em2em0.4emrgba(0,0,0,0.3),inset0.4em0.4em0.1em0.5emrgba(0,0,0,.4);z-index:-1;}最后，调整由图案倾斜引起的位移：.butterfly{transform:translateX(1em);}大功告成！