HTML5标准的战争再一次重燃战火，在本周举行的Adobe Max上，Adobe公司推出了全新的CSS Shaders项目。

这项由Adobe和Apple、Opera合作研发的新标准已经提交至W3C，将为CSS技术带来3D图形特性。

Shader（着色器）可以理解为是一种运行于显卡端的小程序，通常用于游戏和其他图形相关的应用。着色器有两种，一种是顶点着色器，用于控制几何 体的顶点以绘制出3D表面网格；另一种是片元着色器，用于控制像素的颜色。CSS Shaders技术将允许开发者同时使用顶点着色器和片元着色器。

在CSS中使用着色器可以制作出很多吸引眼球的动态效果。Adobe展示了一些Demo视频，在第一个视频中Twitter的页面被渲染成了弯曲的 表面；第二个视频更加有趣，将Google地图和街景渲染折叠了起来，像真的纸质地图那样。因为着色器可以作用于所有HTML内容，所以CSS Shaders渲染的元素包括了普通的表格、SVG甚至是HTML5 Video等等。

CSS目前已经可以制作一些3D动画效果，但是着色器这个关键角色的加入，将使这项技术变得更加灵活，提高了可编程性。CSS Shaders可以与Adobe Edge配合使用，制作出更多动态效果的网页。Adobe称未来Edge将拥有更强的表现力，而CSS Shaders正是为了达到这个目的而推出的。

目前，Adobe正在基于WebKit开发这一新技术，Apple Safari、Google Chrome和Adobe自己的AIR都是基于这一引擎开发的。Adobe首席科学家Vincent Hardy在官方博客中说，Adobe希望将CSS Shaders标准化。

“目前Adobe已经将CSS Shaders提交至W3C FX Task Force，我们的目标是希望一旦这项技术被W3C批准，就立即为WebKit贡献代码。这样Web开发者就能尽快地开始享受这一系列强大的滤镜效果！”Hardy说。

CSS Shaders内置了一些常用的滤镜，包括设置模糊、阴影、色调、翻转、灰度、透明度、Gamma值等。另外也允许开发者自己编写着色器代码，使用的语言 ——不出所料，和WebGL一样——是GLSL。终于和已经咸鱼翻身的Javascript、Java一样，GLSL这门一直禁锢于传统图形界的老兵级语 言，也终于要在Web时代开始绽放出新的光芒了！

然后，话题自然就延伸到了CSS Shaders与WebGL的比较上。Adobe称WebGL只能作用于一个Canvas，而CSS Shaders适用于任何Web内容。CSS的本意就是用来定义网页样式的，Shader的加入毋庸置疑可以大大增加灵活度，让开发者有更多的方式去创造 出更具想象力的网页。但是上帝的归上帝，凯撒的归凯撒，这和WebGL是不冲突的。

网页前端们，是不是开始考虑学习一下OpenGL 2.0 ES和GLSL呢？

(文/HiWebGL.COM)