opacity在IE6~8下无效果，解决的办法

问题出现时rgba()在ie6下不出效果，最后查到是opacity的问题。

opacity是css3时出现的，目前主流浏览器都支持。but老IE是个麻烦的问题。

filter:alpha(opacity=50);

总结网上经验： 1 <!doctype html>

 <html>

 <head>

     <meta charset='utf-8'>

     <meta name='author' content='w201604007-宋英杰'>

     <title>opacity</title>

     <style type='text/css'>

         html,body,div{margin:0;padding:0;}

         body{background:#FFF;}

         .s1{font-family:serif;

         background-color:rgb(120,160,9);opacity:0.4;/*ff46,chrome49,opara36,ie9不透明度,透明度效果，包括了文字*/

         zoom:1;filter:progid:DXImageTransform.Microsoft.Alpha(opacity=40);/*ie透明度效果，包括了文字*/
　　　　　　filter:alpha(opacity=40);zoom:1;position:static;
}
　　　　　　.s1 span{color:#000;position:relative;}/*文字、背景分离分别给样式,结合定位2.16.5.28更新*/

     </style>

 </head>

 <body>

     <p class="s1"><span>serif字体</span></p>

 </body>

 </html>

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

直接rgba对底色加样式，再兼容ie6，代码如下：

 <!doctype html>

 <html>

 <head>

     <meta charset='utf-8'>

     <meta name='author' content='w201604007-宋英杰'>

     <title>opacity</title>

     <style type='text/css'>

         html,body,div{margin:0;padding:0;}

         body{background:#FFF;}

         .s1{font-family:serif;

         background-color:rgba(169,169,169,0.7);/*opacity:0.4;ff46,chrome49,opara36,ie9不透明度,文字无*/

         zoom:1;filter:alpha(opacity=70)progid:DXImageTransform.Microsoft.gradient(startColorstr=#A9A9A9,endColorstr=#A9A9A9);

         /*ie6测试，底色变成了#c2c2c2,有透明度效果，但也包括了文字*/

     </style>

 </head>

 <body>

     <p class="s1"><span>serif字体</span></p>

 </body>

 </html>

抛砖引玉，有更好的方法，大家可以评论告知，互相学习。

opacity在IE6~8下无效果，解决的办法的更多相关文章

  1. [转]position:fixed; 在IE9下无效果的问题

    本文转自:http://www.cnblogs.com/xinwang/archive/2013/04/06/3002384.html 平常DIV+CSS布局时,position属性一般用absoul ...

  2. MySQL修改编码为UTF-8无效果解决办法

    本来这是一件很简单的事,有很多博客里都有教程,但却足足花了我半天的时间才解决问题. 可能是因为我的MySQL安装时没有选择默认路径的原因,按照网上的教程修改了下图中的my.ini配置文件后编码并没有发 ...

  3. IE6/IE7下margin-bottom失效兼容解决办法及双倍边距问题

    (从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期 2014-04-08) 一.IE6/IE7下margin-bottom失效兼容解决办法 1.用padding-bottom代替:2.在 ...

  4. IE6条件下的bug与常见的bug及其解决方法

    1.IE6条件下有双倍的margin 解决办法:给这个浮动元素增加display:inline属性 2. 图片底部有3像素问题 解决办法:display:block;或者vertical-align: ...

  5. 使用ie的filter来解决rgba在IE8下没有效果的问题

    使用ie的filter来解决rgba在IE8下没有效果的问题,css代码如下: background: rgba(255,255,255,0.1); filter:progid:DXImageTran ...

  6. 一句white-space:nowrap解决IE6,IE7下浮动元素不自动换行

    一句white-space:nowrap解决IE6,IE7下浮动元素不自动换行

  7. PNG24在ie6下的完美解决方法!(DD_belatedPNG)

    原网址:http://www.zjgsq.com/1629.html 之前写过一篇<js+css滤镜设置解决PNG24在IE6下显示问题> 解决方法不是很完美,使用起来也比较麻烦. DD_ ...

  8. 虚拟机——mnt_hgfs下无目录情况解决

    /mnt/hgfs下无目录情况解决: VMware8虚拟机安装Ubuntu 11.10使用share folders共享目录将虚拟机掉电关闭(不能暂停),设置share folders目录,重启虚拟机 ...

  9. nmtui解决network-scripts目录下无网卡对应配置文件问题

    1.问题出现的原因设备先安装了操作系统,后插上网卡到设备,就会出现/etc/sysconfig/network-scripts目录下无该网卡对应配置文件的问题,但是ifconfig命令能看见系统给该网 ...

随机推荐

  1. logstash 根据type 判断输出

    # 更多ELK资料请访问 http://devops.taobao.com 一.配置前需要注意: 1.Use chmod to modify nginx log file privilege. E.g ...

  2. JavaEE Tutorials (21) - Java EE安全：高级主题

    21.1使用数字证书331 21.1.1创建服务器证书332 21.1.2向证书安全域增加用户334 21.1.3为GlassFish服务器使用一个不同的服务器证书33421.2认证机制335 21. ...

  3. Aix 光盘软件包安装

    1, mount -rv cdrfs /dev/cd0 /mnt (Aix 光盘挂载)2,fuser -kxcu /cdrom && unmount /mnt && u ...

  4. Hibernate 、多表关联映射 - 多对多关系映射（many-to-many）

    hibernate.cfg.xml: <hibernate-configuration> <session-factory name="sessionFactory&quo ...

  5. 浅谈hadoop中mapreduce的文件分发

    近期在做数据分析的时候.须要在mapreduce中调用c语言写的接口.此时就须要把动态链接库so文件分发到hadoop的各个节点上,原来想自己来做这个分发,大概过程就是把so文件放在hdfs上面,然后 ...

  6. 设计模式之二十四：訪问者模式(Visitor)

    訪问者模式: 定义了一个作用于一个类的一些操作,訪问者模式同意在不改变类的前提下添加一些操作. Represent an operation to be performed on the elemen ...

  7. 大表建立索引引发enq: TX - row lock contention等待

    今天要给一张日志表(6000w数据)建立索引,导致生产系统行锁部分功能卡住 create index idx_tb_cid on tb_login_log(user_id); 开始执行后大概花费了20 ...

  8. json（转）

    转自:http://www.cnblogs.com/mcgrady/archive/2013/06/08/3127781.html 阅读目录 JSON的两种结构 认识JSON字符串 在JS中如何使用J ...

  9. jQuery EasyUI combobox多选和赋值

    定义select <select id="ID" name=empVO.acunid class="easyui-combobox" required=& ...

  10. EC读书笔记系列之14：条款26、27、28、29、30、31

    条款26 尽可能延后变量定义式的出现时间(Lazy evaluation) 记住: ★尽可能延后变量定义式的出现.这样做可增加程序的清晰度并改善程序效率 ----------------------- ...