轩枫阁V3主题已上线，本文将介绍本站V3主题关于CSS重构的内容。兼容IE9+，主要看Chrome表现。
鉴于Less能满足本站主题开发的需求，就没有更换成Sass。Less介绍：http://www.lesscss.net/
基于 Less的 CSS代码片段复用和混入库，主要有圆角border-radius、渐变gradient、内阴影inner-shadow、阴影box-shadow、动画animation、transition、宽度计算calc-width、省略text-overflow等，代码见附录。 查看全文
本文将解释，何为贝塞尔曲线，及其如何运用在动画中。
这里给出两个在线动画调试工具。
cubic-bezier还是比较少用到，PC端中，有浏览器不兼容。但是手机端中，可以使用并带来炫酷的动画及体验。
贝塞尔曲线(Bézier curve)，又称贝兹曲线或贝济埃曲线，是应用于二维图形应用程序的数学曲线。一般的矢量图形软件通过它来精确画出曲线，贝兹曲线由线段与节点组成，节点是可拖动的支点，线段像可伸缩的皮筋。
cubic-bezier即为贝塞尔曲线中的绘制方法。图上有四点，P0-3，其中P0、P3是默认的点，对应了[0,0], [1,1]。而剩下的P1、P2两点则是我们通过cubic-bezier()自定义的。cubic-bezier(x1, y1, x2, y2) 为自定义，x1,x2,y1,y2的值范围在[0, 1]。
而在CSS3中，常用的几个动画效果，用cubic-bezier表示分别为：
|
1 2 3 4 5 |
ease: cubic-bezier(0.25, 0.1, 0.25, 1.0) linear: cubic-bezier(0.0, 0.0, 1.0, 1.0) ease-in: cubic-bezier(0.42, 0, 1.0, 1.0) ease-out: cubic-bezier(0, 0, 0.58, 1.0) ease-in-out: cubic-bezier(0.42, 0, 0.58, 1.0) |