为了提供现代化的应用体验,使用动画以及小体积的图像是非常必要的。接下来的内容提供了你在这一领域所需要的知识。
- CSS transforms
- CSS 变换让你能够旋转和缩放HTML内容,充分利用硬件加速提供的优势, 完全不需要依赖于 Javascript 代码。
- CSS transitions
- CSS 过渡让你能够以动画的方式改变你的 CSS 样式。 一旦设定了一个过渡效果,对于 CSS 样式的更改将在一段时间内呈现,而不是瞬息完成。 它使得简单且高效地为你的应用创建极其丰富的视觉效果成为可能。
- CSS animations
- CSS 动画让你从一个更基础的层面上通过动画形式更改你的文档,使用关键帧来精确地设定动画效果。它同样允许你创建循环的动画,而非仅能够发生一次的动画,就像是CSS 过渡一样,完全无需依赖 Javascript 代码。
- HTML canvas
-
HTML
<canvas>
元素为你提供了一个可供绘制的二维空间。它有许多的用途,包括二维游戏。 - WebGL
- WebGL 是一个网络友好的 OpenGL ES 版本,允许你的应用提供硬件加速的三维图像。
- SVG
- 可伸缩矢量图形 (SVG) 是一种允许你使用矢量而非位图来构建图形的技术。尤其适用于需要确保可伸缩性、使用了图表和表格、高质量的大小可变的用户界面。