发表于: 2016-03-08 00:11:06

1 1864


今天完成的事:完成了task8

明天计划的事:task9

遇到的问题:一开始想到了用css3的3D动画来写,然而真正开始写的时候懵逼了,完全不知道如何开展。后来找了一下资料总算写出来了。

一、加一个div用position调整好位置,覆盖职业介绍卡片。

二、用rbga(0,0,0,0.7)调整背景透明度。

三、用transform:rotateY(180deg)把里面的字沿Y轴反过来。

四、用backface-visibility:hidden隐藏这个div。

五、给职业介绍卡片加一个伪类:hover{transform:rotate(360deg)}将iOS介绍360度翻转过来。

六、后来去看了06师兄的代码加了一个transition:all 2s控制卡片翻转的时间(师兄威武)

七、还在06师兄那里看到了cursor:pointer  好像是给iOS介绍卡片加一个光标(不过这个应该可以不用加)

收获:学会了怎么用css3做3D动画

task8代码https://github.com/Lcreeper/task1/tree/master/task8


返回列表 返回列表
评论

    分享到