效果图如下所示：
开发三八女王节表白神器运用到的知识点：css33D场景、3D变换、爱心制作技巧、3D立方体制作技巧、自定义动画，原生js DOM节点操作、循环等。
:point_down:html代码：
| <div id="display"> </div> <div class='heart3d'> <div class='rib1'></div> <div class='rib2'></div> <div class='rib3'></div> <div class='rib4'></div> <div class='rib5'></div> <div class='rib6'></div> <div class='rib7'></div> <div class='rib8'></div> <div class='rib9'></div> <div class='rib10'></div> <div class='rib11'></div> <div class='rib12'></div> <div class='rib13'></div> <div class='rib14'></div> <div class='rib15'></div> <div class='rib16'></div> <div class='rib17'></div> <div class='rib18'></div> <div class='rib19'></div> <div class='rib20'></div> <div class='rib21'></div> <div class='rib22'></div> <div class='rib23'></div> <div class='rib24'></div> <div class='rib25'></div> <div class='rib26'></div> <div class='rib27'></div> <div class='rib28'></div> <div class='rib29'></div> <div class='rib30'></div> <div class='rib31'></div> <div class='rib32'></div> <div class='rib33'></div> <div class='rib34'></div> <div class='rib35'></div> <div class='rib36'></div> <div class="per"> <div class="img"><img width="50" height="50" src="images/1.jpg" /></div> <div class="img"><img width="50" height="50" src="images/2.jpg" /></div> <div class="img"><img width="50" height="50" src="images/3.jpg" /></div> <div class="img"><img width="50" height="50" src="images/4.jpg" /></div> <div class="img"><img width="50" height="50" src="images/5.jpg" /></div> <div class="img"><img width="50" height="50" src="images/6.jpg" /></div> </div> </div> |
