CSS 3.0实现立体书本特效

给大家分享一个运用CSS 3.0实现的立体书本特效,效果如下:

还真是很像一本书吧,但是需要下面三张图片配合。

1.书的正面图(1.jpg),实际尺寸以代码中的为准。

CSS 3.0实现立体书本特效_第1张图片

2.书的侧面(2.jpg),实际尺寸以代码中的为准。

CSS 3.0实现立体书本特效_第2张图片

3.书本翻页处的修饰(3.png),实际尺寸以代码中的为准。

哈哈,图太小了,请拿放大镜看。

以下是代码实现,欢迎大家复制粘贴。





    
    CSS 3.0实现立体书本特效
    



    
    

 

你可能感兴趣的:(CSS)