CSS 动画背景不仅仅是华而不实的技巧。它们是网站心脏的律动,是隐藏在一行行代码中的创意低语。
虽然并不是Adobe的Photoshop发明了混合模式,但它的实现效果是最真实的。但现在,你不需要使用Photoshop来运用混合模式美化你的图片,因为CSS3里提供里动态的实现这种效果的方法。
“视差(parallax)”效果现在在互联网上越来越流行了。如果你还没听说过什么是视差效果,它其实就是利用图片形成不同的层,分别以不同的速度,不同的方向移动产生的效果。这会产生出很奇妙的视觉效果,能有力的吸引住浏览者的目光。
使用视频作为网页背景是件很酷的事情,但也是件困难的事情。CSS里的background-image属性只能使用图片、SVG、颜色或渐变色。但从技术讲,我们是可以伪造出一种效果,让视频以背景的角色出现在其它HTML元素后面。这其中的难点是视频要填充整个浏览器页面,而且要响应浏览器窗口大小的变化。
我说的是background-size。CSS里的background-size属性能够让程序员决定如何在指定的元素里展示。MooTools程序员Christoph Pojer在他的网站上运用了background-size技术,使得在浏览器上他的头像始终“全面覆盖”在页头上——甚至是在手机上。下面让我们来看看神奇的background-size属性是如何使用的。
火狐浏览器和谷歌浏览器就实现了一些有趣的、自己独有的CSS属性,这些属性虽然都很有趣,但要融入标准的HTML5还需要不少时间。有一个你们可能从未听说的有趣的CSS功能是火狐浏览器独创的-moz-element属性,使用它,你可以用网页上任意的内容作为背景,跟背景图的效果相似。
CSS背景动画很长时间以来都是一个热门话题,很多时候都是因为效果特别绚丽,而且不需要额外的技术。最近有人问我是否可以给页面上一个指定的元素安排多重背景动画,答案是yes….虽然有些限制因素。让我们来看看如何实现这个效果!
慢悠悠的云