CSS——display:none与visibility:hidden的区别

1.display:none与visibility:hidden的区别   display:none隐藏对应的元素并且其他元素会挤占该元素原来的空间,即不为被隐藏的对象保留其物理空间,使用该属性后,HTML元素(对象)的宽度、高度等各种属性值都将“丢失”;   visibility:hidden隐藏对应的元素但其他元素不会挤占该元素原来的空间,即为被隐藏的对象保留其物理空间,使用该属性后,HTML元素(对象)仅仅是在视觉上看不见(完全透明),而它所占据的空间位置仍然存在,也即是说它仍具有高度、宽度等属性值。   记住这两点之后也就不难区分这两者了,如果可以理解为“ […]

模拟书本翻页的相册

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