Dreamweaver教程 FrontPage教程 Flash教程
  • CSS教程
  • javascript教程
    当前位置:教程 > 网页制作 > CSS教程 > 正文

    CSS滤镜之Shadow属性

    编辑:教程网 来源:网络 时间:2011年09月26日 15:43
    Shadow属性可以在指定的方向建立物体的投影。它的表达式是这样的:

      Filter:Shadow(Color=color,Direction=direction)

      在这里,Shadow有两个参数值:Color参数用来指定投影的颜色;Direction参数用来指定投影的方向。
      这里说的方向与我们在第二节Blur属性中提到的“方向与角度的关系”是一样的。   也许您会问,前面讲到的Dropshadow属性和Shadow属性有什么不同吗?
      光说的话,您恐怕还难以理解,让我们看一看分别利用这两个属性做出来的效果有什么不同(见下图):

     

             Shadow效果        Dropshadow效果

      这样一对比,就可以很明显的看出两者的不同。
      Shadow属性可以在任意角度进行投射阴影,Dropshadow属性实际上是用偏移来定义阴影的。所以,看上去左图的文字和阴影就像是一体的,而右图的文字就像脱离了阴影一样。
      本例的代码如下:

      
       
        shadow
       
      
      
       //*区域内为Shadow类*//
      

            font-weight:bold;color:#FF9900;”>
        Hongen Online

    //*定义字体名称、大小、粗细、前景色*//
       
       //*区域内为Dropshadow类*//
       

             font-weight:bold;color:#FF9900;”>
        Hongen Online

    //*定义字体样式与Shadow类的一样*//
       
       
      


  • 原文来自 教程网 转载请注明:http://www.websmill.com/wangye/css/25209.html

  • 上一篇:CSS滤镜之Invert属性
  • 下一篇:CSS滤镜之Wave属性