安卓手机必备精品下载
到顶部
到尾部
当前位置：站长之家首页 > DIV+CSS教程 > 正文

CSS滤镜同时过滤文字的问题的解决方法

来源:网络来稿　热量:正在测温 ℃ 　生产日期：2010-09-08 00:51 转播到微博
CSS滤镜同时过滤文字的问题的解决方法
更多


初用CSS滤镜的朋友可能会遇到这样的问题:给div套上filter:alpha(opacity=50); 滤镜后，里面的文字也随之半透明,这种情况下，我们该怎么办呢？经过本人查阅大量资料，实验N次终于找到了一个兼容ie6,ie7,ie8以及firefox的css透明滤镜的方法,且看我举例说明.

html代码:
 

代码如下:

<div id=”body”>
<span><龙哥博客>解决CSS滤镜同时过滤文字的问题</span>
</div>
 


css代码:

代码如下:

<style type=”text/css”>
#body{ border:1px solid #c00; background-color:rgba(212,0,0,0.5); background:#f00\9; filter:alpha(opacity=10); width:500px; margin:40px auto; line-height:200%; font-size:14px; padding:14px;}
</style>
 


这样的代码并不能解决过滤文字的问题,想要不过滤文字，就必须在CSS代码里加上这行代码：
 

代码如下:

#body *{ position:relative;}
 


星号是为了让IE6和IE7执行，火狐和IE8就不执行了，火狐本身来讲就不支持IE特有的滤镜功能，所以这里没必要再加星号，怎么样？很简单吧~
 

您或许也对这些文章感兴趣

  • CSS/DIV布局专题讲解CSS滤镜的应...
    		•
  • 使用css滤镜代码把网站变为灰...
    		•

    关键词: CSS滤镜 过滤文字

    [收藏本文] [关闭本文] [返回首页]

    [如果您觉得本站不错，请告诉身边的朋友，站长不胜感激^_^]

    最新文章

    热门文章

    推荐素材

    快捷导航

    
    网站法律顾问：庄毅雄律师

    全球站长之家资源均来自互联网，如有版权问题请邮件info@dosxp.com立即删除，本站不承担任何法律责任。

    另本站所提供软件，仅供用户测试交流，请在下载时先检测病毒再使用，并在24小时内删除，请勿用于任何商业行为，一切后果与法律责任与本站无关。

    您访问的网站目前没有发现被挂马行为
    无觅相关文章插件，快速提升流量