Css实现透明效果,兼容IE8

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

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

http://fanshuyao.iteye.com/

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

IE8显示效果:

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

下面为较完整的代码:

<li style="background-color:#2F8CEF;">
<i class="icon-fire icon-4x"></i>
<div class="service_box_content">
<div class="service_box_title">点火通气申请</div>
<div class="service_box_text">Ventilation application</div>
</div>
</li> /*下面为Css样式*/ .service_box ul li{
width:48%;
margin-right:8px;
margin-bottom:8px;
padding-top: 15px;
height: 140px;
display:block;
border: solid 1px #fff;
-moz-border-radius: 5px;
-webkit-border-radius:5px;
border-radius:5px;
position: relative;
float: left;
} .service_box ul li i{
color:#fff;
} .service_box ul li div.service_box_content{
height: 60px;
width: 100%;
position: absolute;
left: 0px;
bottom: 0px;
color: #fff;
/* background: rgba(0, 0, 0, 0.2) none repeat scroll 0 0 !important; */
background-color:#000;
opacity:0.3;
filter:alpha(opacity=30);
}

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

蕃薯耀 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. spoj gss2 : Can you answer these queries II 离线&&线段树

    1557. Can you answer these queries II Problem code: GSS2 Being a completist and a simplist, kid Yang ...

  2. 【技术贴】解决myeclipse SVN 提交代码 commit:remains in tree-conflict错误的解决办法

    [技术贴]解决myeclipse SVN 提交代码 commit:remains in tree-conflict错误的解决办法 错误是:Aborting commit: xxxxx’ remains ...

  3. ZOOKEEPER在CENTOS6上的再安装

    作DUBBO时,肯定是需要的,,对的,,DUBBO也要熟悉一下才行啦.. URL: http://www.centoscn.com/CentosServer/test/2015/0120/4531.h ...

  4. RabbitMQ安装简单过程

    找到一本ACTION IN RABBITMQ,仔细看.现在先安装起来.. 参考主要的URL,包括安装,用户管理,权限管理.我用的都是最新版本. http://my.oschina.net/indest ...

  5. 【UVALive - 3211】Now or later (二分+2-SAT)

    题意: 有n架飞机需要着陆.每架飞机有两种选择,早着陆或者晚着陆,二选其一.现在为了保证飞机的着陆安全,要求两架着陆的飞机的时间间隔的最小值达到最大. 分析: 最小值最大问题我们想到二分答案.对于猜测 ...

  6. ExecutorService介绍

    转自: http://victorzhzh.iteye.com/blog/1010359 下面是excutor相关的类结果: ExecutorService接口继承了Executor接口,定义了一些生 ...

  7. 移动大数据时代最IN编程语言必读书单

    移动大数据时代最IN编程语言必读书单 这是一个快速更迭,快鱼吃慢鱼的时代.从IT 时代演变成 DT 时代,再到现在的智能时代.急速革新的各种新技术.新工具.新平台,需要程序员掌握良好的编程思想和学习方 ...

  8. 【转】Eclipse中设置ButterKnife进行注解式开发步骤 -- 不错

    原文网址:http://www.bubuko.com/infodetail-974262.html 最近在进行Android注解式开发的学习,正在尝试用ButterKnife.ButterKnife的 ...

  9. 转---在ASP.NET MVC中实现登录后回到原先的界面

    有这样的一个需求:提交表单,如果用户没有登录,就跳转到登录页,登录后,跳转到原先表单提交这个页面,而且需要保持提交表单界面的数据. 提交表单的页面是一个强类型视图页,如果不考虑需要保持提交表单界面的数 ...

  10. codeforce --- 340D

    D. Bubble Sort Graph time limit per test 1 second memory limit per test 256 megabytes input standard ...