用CSS3完善网站2.9.4媒介查询媒介查询（MediaQueries）是CSS3对媒介类型(MediaType)的一个扩展，提供了一个可以根据用户显示器或者设备应用不同样式的规则，例如视窗的宽度、屏幕的分辨率以及可显示色彩范围。它是创建移动Web应用的强大工具，这样我们能为多种手机或者移动终端提供适配方案。例如，media=nscreenand(min-width：600px)and(max-width：800px)-匹配宽度在600像素到800豪素之间的屏幕。2.9.5滤镜效果2011年12月初，W3C公布了一个新的规范——滤镜效果（FilterEffect）o这是一个令人兴奋的新特性，我们可以使用它来在浏览器中创建Photoshop般的效果。借助CSS3滤镜，我们可以直接在网页上实现Instagram、Path里那些令人着迷的滤镜效果oCSS3滤镜不仅提供了调节色相、饱和度、亮度、黑白度、模糊度的常用滤镜，还支持SVG、颜色矩阵、光源等多种特性。这个规范非常强大，从此我们就有了在网页上实现复杂滤镜效果的一切条件，也许不久我们就能见到Web端的Photoshop呢。图2-67【另见彩插图2-67）是使用滤镜效果前后的效果图。2.9.6着色器图2-67由Adobe、苹果、Opcra提出的CSS着色器(CSSShader)将为CSS技术带来3D图形的支持。着色器在Flash、游戏和其他图形相关的应用中使用非常普遍，它本质上是一个小程序，提供了一种特殊效果（例如失真、模糊或者旋涡效果），其行为由输人参数（失真、模糊或旋涡的量）控制。着色器有两种：一种是顶点着色器，济南网站建设公司常用来对场景巾的几何图形坐标进行矩阵变换，它是完全可编程的，你可以以任何你想要的方式修改几何图形；另一种是片段着色器（也叫像素着色器），它决定每个i角形像素的最终颜色，现代3D游戏中的动态光源效果常常就是由它完成的oCSS着色器允许开发者同时使用顶点着色器和片段着色器。CSS着色器对于生成动态效果非常有用，是CSS滤镜效果、转换和动画规范的有力补充，也为滤镜效果规范的feCustom元素提供了一种解决方案oCSS3的滤镜效果为任意网页内容提供了一种应用一系列有限基本滤镜的方式，而CSS着色器提供了一种滤镜效果的可扩展机制，允许开发者自定义着色效果，以此来为HTML元素实现丰富的可视化动画效果。此外，CSS着色器为滤镜模型引入了顶点着色器的概念，它通过为元素盒子应用顶点着色器的方式带来了任意改变文档中元素形状的能力oCSS着色器的另外一个强大之处还在于它能够应用在所有的HTML，元素上，包括图片、Canvas、SVG、视频等。图2-68是Adobe提供的演示视频截图，其中Twitter、Google地图和街景被自由地弯曲和折叠。图2-68图2-69足一个给图片运用波纹效果的示例，这种波纹效果主要的CSS代码如下（请注意目前还未有浏览器支持