载入中
自定义HTML载入中... loading
CSS滤镜.006Fliph、Fliv属性 [转贴 2007-11-25 15:34:57]  删除... 
字体变小 字体变大


五、CSS滤镜

 


  6FlipHFlipV属性

  FlipCSS滤镜的翻转属性,FlipH代表水平翻转,FlipV代表垂直翻转。它们的表达式很简单,分别是:

  FilterFlipH

  FilterFlipV

  我们先来看一幅图:点击可放大

  下面我们分别对它实现水平翻转和垂直翻转,并且在图片上方的一段文字,也发生翻转。代码如下:

  <html>
   <head>
   <title>flip css</title>
   <style>//*设置CSS样式开始*//
   <!--
   div{positionabsolutetop20width300
     filterfliphflipv);}
   //*定义DIV范围内的样式,绝对定位,翻转为水平翻转或垂直翻转。
    注意:在这里fliphflipv只取其中的一个*//
   img{positionabsolutetop70left40
     filterfliphflipv);}
   //*定义图片的样式,绝对定位,翻转属性和DIV一样。*//
    -->
   </style>
   </head>
   <body>
   <div>
   <p style=“font-familybaileyfont-size36pt
         font-weightbold colorrgb(10,128,156)”>
    Leaf Village </p>
   //*定义字体名称、大小、粗细、颜色*//
   </div>
   <p><img src=“ss05058.jpg”></p>
   //*导入一张图片*//
   </body>
  </html>

  代码产生的两个效果分别如下图:(点击可以放大)

             

        水平翻转                垂直翻转

  翻转的属性应用是不是很简单。下一节我将向您介绍Glow属性。


 

所属版块: 科技
票数:
什么是“我顶”?
点击数:    评论数:
本文章引用通告地址(TrackBack Ping URL)为:
本文章尚未被引用。
发表评论
大 名:
(不填写则显示为匿名者)
网 址:
(您的网址,可以不填)
标 题:
内 容:
请根据下图中的字符输入验证码:
(您的评论将有可能审核后才能发表)
和讯个人门户 v1.0 | 和讯部落 | 客服中心