Css实现透明效果,兼容IE8

>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

蕃薯耀 2015年9月9日 17:39:24 星期三

http://fanshuyao.iteye.com/

  1. /* background: rgba(0, 0, 0, 0.2) none repeat scroll 0 0 !important; */
  2. background-color:#000;
  3. opacity:0.3;
  4. filter:alpha(opacity=30);

IE8显示效果:

谷歌内核浏览器显示效果:

下面为较完整的代码:

  1. <li style="background-color:#2F8CEF;">
  2. <i class="icon-fire icon-4x"></i>
  3. <div class="service_box_content">
  4. <div class="service_box_title">点火通气申请</div>
  5. <div class="service_box_text">Ventilation application</div>
  6. </div>
  7. </li>
  8.  
  9. /*下面为Css样式*/
  10.  
  11. .service_box ul li{
  12. width:48%;
  13. margin-right:8px;
  14. margin-bottom:8px;
  15. padding-top: 15px;
  16. height: 140px;
  17. display:block;
  18. border: solid 1px #fff;
  19. -moz-border-radius: 5px;
  20. -webkit-border-radius:5px;
  21. border-radius:5px;
  22. position: relative;
  23. float: left;
  24. }
  25.  
  26. .service_box ul li i{
  27. color:#fff;
  28. }
  29.  
  30. .service_box ul li div.service_box_content{
  31. height: 60px;
  32. width: 100%;
  33. position: absolute;
  34. left: 0px;
  35. bottom: 0px;
  36. color: #fff;
  37. /* background: rgba(0, 0, 0, 0.2) none repeat scroll 0 0 !important; */
  38. background-color:#000;
  39. opacity:0.3;
  40. filter:alpha(opacity=30);
  41. }

>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

蕃薯耀 2015年9月9日 17:39:24 星期三

http://fanshuyao.iteye.com/

Css实现透明效果,兼容IE8的更多相关文章

  1. css 完美垂直居中解决方案兼容ie8以上等其他浏览器

    css 完美垂直居中解决方案兼容ie8以上等其他浏览器 <pre><!DOCTYPE html><html><head> <title>DI ...

  2. css hover图片hover效果兼容ie8

    例子: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8 ...

  3. 使用CSS实现透明边框的效果——兼容当前各种主流浏览器[xyytIT]

    这个效果可是通过代码实现的哦,在不同浏览器下都可以正常显示 对于html中使用CSS实现透明边框的效果,主要有以下四种属性设置方法,但由于 这些属性兼容性并不是很好,单一使用会造成不同浏览器显示效果不 ...

  4. 【原】CSS实现背景透明,文字不透明,兼容所有浏览器

    11.11是公司成立的日子,16岁啦,我呢3岁半,感谢公司给了这样一个平台,让我得以学习和成长,这里祝愿公司发展越来越好~ 进入主题,每年11月11号是光棍节,产生于校园,本来只是一流传于年轻人的娱乐 ...

  5. CSS实现背景透明,文字不透明,兼容所有浏览器

    11.11是公司成立的日子,16岁啦,我呢3岁半,感谢公司给了这样一个平台,让我得以学习和成长,这里祝愿公司发展越来越好~ 进入主题,每年11月11号是光棍节,产生于校园,本来只是一流传于年轻人的娱乐 ...

  6. css样式设置图片半透明度,兼容IE8,火狐

    关于背景颜色透明的兼容浏览器的问题,一直是个问题,我所写的兼容IE8,和火狐,说是兼容所有浏览器我就没有测试,有兴趣的朋友可以自己测试下吧. background-color:white;filter ...

  7. Css:背景色透明,内容不透明之终极方法!兼容所有浏览器

    转载 http://www.cnblogs.com/jikey/archive/2012/08/31/2665880.html <!DOCTYPE html PUBLIC "-//W3 ...

  8. 用CSS实现Firefox 和IE 都支持的Alpha透明效果

    有的时候,为了实现一些特殊效果,需要将页面元素变透明,本文介绍的就是用 CSS 实现 Firefox 和 IE 都支持的 Alpha 透明效果.CSS: filter:alpha(opacity=50 ...

  9. CSS 实现图片灰度效果 兼容各种浏览器

    CSS 实现图片灰度效果 兼容各种浏览器如360浏览器 CSS实现图片灰度效果就是通过CSS样式让彩色图片呈现为灰色,相当于把一张图像的颜色模式调整为灰度,CSS可以通过以下几种方法来实现灰度效果. ...

随机推荐

  1. [译]36 Days of Web Testing(二)

    Day 7: Http 和 Https Why? 当在网络上传输一些私人,敏感信息时,应该采用加密的手段来保证这些信息在传输的过程中不被侦测到.Https协议正是这种实现机制. Https是一种广泛使 ...

  2. 一个消除if语句的例子

    // 一个按钮点击事件,判断点击按钮是那一个显示出他的信息 - (IBAction)buttonPressed:(id)sender { if (sender == self.leftButton) ...

  3. 【Xamain 跨平台机制原理剖析】

    原文:[Xamain 跨平台机制原理剖析] [看了请推荐,推荐满100后,将发补丁地址] Xamarin项目从喊口号到现在,好几个年头了,在内地没有火起来,原因无非有三,1.授权费贵 2.贵 3.原生 ...

  4. Android开源项目发现--- 工具类向下兼容篇(持续更新)

    1. ActionBarSherlock 为Android所有版本提供统一的ActionBar,解决4.0以下ActionBar的适配问题 项目地址:https://github.com/JakeWh ...

  5. [LeetCode#271] Encode and Decode Strings

    Problem: Design an algorithm to encode a list of strings to a string. The encoded string is then sen ...

  6. js之script属性async与defer

    概念 默认情况下js的脚本执行是同步和阻塞的,但是 <script> 标签有 defer 和 async 属性, 这可以改变脚本的执行方式,这些都是布尔类型了,没有值,只需要出现在 < ...

  7. bzoj2337

    这句话感觉都能成定理了:xor问题逐位考虑……这道题就是这样,然后和bzoj3143和相似但这道题多了自环,于是我们设f[i]表示当前位由i走到n的后为1的数学期望显然f[n]=0,可得f[i]=si ...

  8. 【转】Android Building System 总结 - 一醉千年 - CSDN博客

    原文网址:http://www.360doc.com/content/15/0314/23/1709014_455175716.shtml  Android Building System 总结 收藏 ...

  9. HDU-2149 Public Sale

    http://acm.hdu.edu.cn/showproblem.php?pid=2149 巴什博奕(Bash Game): Public Sale Time Limit: 1000/1000 MS ...

  10. 6N137的使用

    (1)引脚图 (2)功能表 (3)内部结构图 信号从2.3脚输入,反向偏置的光敏二极管受光照后导通,经过电流电压转换,输入到与门一端,与门另一端为使能端.由于输入信号为集电极开路,需要加上拉电阻.当使 ...