模拟书本翻页的相册

相册 看到别人绚丽的相册,想不想自己拥有一个,下面跟着我创建一个属于自己的相册吧。 浏览 1.利用div将相册所需要的图片装起来 2.接下来就需要通过css来对div进行调整,使得相册更加漂亮 (1).第一步将所有图片都定位到一起,即所有的图片叠在一起,效果如图所示 (2).接下来就需要让每一张图片都动起来,也就是最重要的步骤。css如何实现动画自然而然想到了animation; 不过我们的相册需要的是3D效果,因此需要将装图片的div及父级div都需要设置transform-style: preserve-3d;(需要做浏览器兼容),这样设置后就可以达到3D效果。 翻页时都是绕着书的左边旋转 […]

css书写规范,顺序

CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等) 2.大小(width, height, padding, margin) 3.文字系列(font, line-height, letter-spacing, color- text-align等) 4.背景(background, border等) 5.其他(animation, transition等) css-written-order CSS书写规范 使用CSS缩写属性 CSS有些属性是可以缩写的,比如padding,margin,font等等,这样精简代码同时又 […]