IE8不支持以前{filter:alpha(opacity=50);}的私有属性,

转而支持更规范的私有属性-ms-filter: “progid:DXImageTransform.Microsoft.Alpha(Opacity=50)”;

加之Firefox2.0和Opera9.0以前版本很少见到,

所以所有的主流浏览器都已经支持纯CSS而不用png图片来实现半透明效果,

 <div id="out">
<div id="in">不透明<div>
<div id="alpha">半透明<div>
<div>
<style type="text/css">
#out{
padding:20px 0;
height:100px;
width:200px;
position:relative;
}
#in{
background:#fff;
margin:0 10px;
}
#alpha{
position: absolute;
top:;
left:;
width: 100%;
height:100%;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; /*IE8*/
filter:alpha(opacity=30); /*IE5、IE5.5、IE6、IE7*/
opacity: .3; /*Opera9.0+、Firefox1.5+、Safari、Chrome*/
z-index: -1; /*让其位于in的下面*/
background:#fff;
}
</style>

CSS实现半透明的方法的更多相关文章

  1. CSharpGL(40)一种极其简单的半透明渲染方法

    CSharpGL(40)一种极其简单的半透明渲染方法 开始 这里介绍一个实现半透明渲染效果的方法.此方法极其简单,不拖累渲染速度,但是不能适用所有的情况. 如下图所示,可以让包围盒显示为半透明效果. ...

  2. 为IE单独写CSS的三种方法

    本文由 Kayo Lee 发表,本文链接:http://kayosite.com/the-methods-make-css-only-for-ie.html 因为万恶的 IE 存在各种的不标准,因此, ...

  3. 三种纯CSS实现三角形的方法

    看到像上图这样的 tip 的小三角,你会怎么办? 切个图上去?恩,不错,简单,兼容性也一级棒,不但好控制,那点小东西也增加不了多少图片的大小.但有没有更好更讲究技巧的办法呢?哈哈,那必须有啊,而且还不 ...

  4. CSS清除浮动的方法

    CSS清除浮动的方法有哪些呢?经常性地会使用到float,很多邪门的事儿都有可能是浮动在作怪,清除浮动是必须要做的,而且随时性地对父级元素清除浮动的做法也被认为是书写CSS的良好习惯之一.下面看今天的 ...

  5. CSS中垂直居中的方法

    昨天总结了css中水平居中的方法,今天来总结一下css中实现垂直居中的方法. line-height line-height用于实现单行文本的垂直居中,如下图中,我们要求单行文本垂直居中,只需要将di ...

  6. HTML5结合CSS的三种方法+结合JS的三种方法

    HTML5+CSS: HTML中应用CSS的三种方法 一.内联 内联样式通过style属性直接套进HTML中去. 示例代码 <pstylepstyle="color:red" ...

  7. CSS模糊效果及其兼容方法

    今天在整理IE滤镜时网站访问这里,居然找到模糊滤镜blur(),感觉太不可思议了,想不到IE居然会有这么多种滤镜效果,这基本上是模仿PS的.今天的重点是模糊滤镜 CSS模糊效果及其兼容方法 实例 兼容 ...

  8. div+css隐藏内容样式方法

    div css隐藏内容样式方法     div+css隐藏内容方法 一般情况下,css隐藏的用途,如下: 1.对文本的隐藏 2.隐藏超链接(另类黑链) 3.对统计代码隐藏 4.隐藏超出图片 5.css ...

  9. CSS技巧: CSS隐藏文字的方法(CSS text-indent: -9999px;)

    建站过过程中朋友喜欢把网站名称用H1表示,但从美观考虑,要用logo图片来代替h1,这时需要隐藏h1内的这段文字,但又不能对搜索引擎不友好,否则就失去了定义h1标签的意义. 在CSS中如何以图代字,找 ...

随机推荐

  1. poj2152 Fire

    好难啊,我弱爆了. 题解看陈启峰的论文... /** * Problem:POJ2152 * Author:Shun Yao * Time:2013.9.2 * Result:Accepted * M ...

  2. 企业DC Windows运维监控规范及C辅助监控开发实战前奏;

    春天来了,小草发芽了,花儿开了,你还在等什么? 人家都自驾游了,ruiy可还是徒步游的,并且还留着汗+油; 什么是生活,我的理解就是跟着gd生,跟着gd活,可是讲到这我又自恋了,人家开二会也没想起我来 ...

  3. 【转】 hive简介,安装 配置常见问题和例子

    原文来自:  http://blog.csdn.net/zhumin726/article/details/8027802 1 HIVE概述 Hive是基于Hadoop的一个数据仓库工具,可以将结构化 ...

  4. [Objective-c 基础 - 3.2] ARC

    A.ARC的基本原理 1.ARC的判断原则:只有没有强指针指向对象,就会立即释放对象 注意,在以下情况,会立即回收内存: (1)指针超出作用域 { Person *p1 = [[Personalloc ...

  5. Block的引用循环问题 (ARC & non-ARC)

    2010年WWDC发布iOS4时Apple对Objective-C进行了一次重要的升级:支持Block.说到底这东西就是闭包,其他高级语音例如Java和C++已有支持,第一次使用Block感觉满简单好 ...

  6. ios开发 json数据文件的存取

    将Json存进本地文件夹     NSArray *paths=NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomai ...

  7. hdu2545 树上战争 (并查集)

    Problem Description 给一棵树,如果树上的某个节点被某个人占据,则它的所有儿子都被占据,lxh和pfz初始时分别站在两个节点上,谁当前所在的点被另一个人占据,他就输了比赛,问谁能获胜 ...

  8. sublime text3的一些小技巧记录(配gif图)

    缓慢更新 1.同时操作多行数据. 示例: 选择你需要的块,然后按ctrl+shift+L键,然后再按end或者home键.

  9. hadoop的hdfs文件操作实现上传文件到hdfs

    这篇文章主要介绍了使用hadoop的API对HDFS上的文件访问,其中包括上传文件到HDFS上.从HDFS上下载文件和删除HDFS上的文件,需要的朋友可以参考下hdfs文件操作操作示例,包括上传文件到 ...

  10. squid3.0 隐藏 hearder 设置

    原文地址: http://www.wenzizone.cn/?p=311 squid2.6可以使用header_access来控制显示与隐藏http的header信息,但是在squid3.0版本中这个 ...