使用css3实现翻书效果（一）

最近在网页上看到一个使用css3制作的很有趣的样式，通过纯css3的使用实现翻书的效果，作为初学者的我决定实现一下该效果~该网站特效如图所示：


是不是感觉特效非常棒，直接使用css样式而不使用图片大大减少了加载速度，也降低了用户流量的损耗，实在是一举两得，下面我介绍一下我的开发步骤：
经过我对网站代码的研究，该书籍div分为以下几部分
1.最上层是写着“CSS TRANSFORM”的书皮，和最左面的棱角。
2.第二层是三页纸（li），当用户鼠标悬停在该div块时，这三个li块的旋转角度均大幅旋转，超过100度。
3.下面是后面累着的两页纸，随着前面书页的动作，小幅度晃动，大约40度左右。
下面是html代码：