opacity:0.5;

　　　　filter:Alpha(opacity=40); //IE8以下

　　　　当我们设置opacity透明时，opacity后代元素会随着一起具有透明性，所以我们Opacity中的文字随着透明值下降越来越看不清楚，而RGBA不具有这样的问题，但是IE浏览器不支持rgba属性。

　　　　

　　　　

<!DOCTYPE html>

<html lang="en">

<head>

	<meta charset="UTF-8">

	<title>Document</title>

	<style type="text/css">

		.container{

			width: 500px;

			height:378px;

			margin: 100px auto;

			position: relative;

		}

		.container i{

			width: 500px;

			height:378px;

			position: absolute;

			top: 0px;

			color:#fff;

			font-size: 50px;

			background-color: #000;

			/* 字颜色会变 */

			/* opacity: 0.4;

			filter: Alpha(opacity=40); */

			/* 字颜色不会变 */

			background: transparent;

			background-color: rgba(0, 0, 0,0.5);

			filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr=#80000000, endColorstr=#80000000);

		}

	</style>

</head>

<body>

	<div class="container">

		<i>喵喵喵</i>

		<img src="a6.jpg">

	</div>

</body>

</html>

　　

背景透明IE和rgba的更多相关文章

  1. opacity的背景透明&background中rgba的背景色透明

    近期使用css实现了一个loading旋转加载的图片效果,类似gif动画 过程中,需要透明背景,但是图片不要透明 只要背景透明!只要背景透明!只要背景透明! 这里对透明模糊了,两种写法,模糊了 A: ...

  2. input设置背景透明、placeholder的字体颜色及大小

    1.设置input背景透明: background:rgba(255,255,255,0.1); 前面三个参数为对应的rgb数值,第四个参数为透明度:0~1,0:透明,1:不透明: 2.设置input ...

  3. 通过IE私有滤镜让IE6 7 8支持背景透明，内容不透明效果。

    CSS3已经支持背景rgba的rgba透明度,这一方法可以避免元素内容也随背景一起变透明(详情请阅http://www.cssha.com/css3-new-knowledge-student).但是 ...

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

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

  5. CSS实现背景透明，文字不透明（兼容各浏览器）

    在 FF/Chrome 等较新的浏览器中可以使用css属性background- color的rgba轻松实现背景透明,而文字保持不透明.而IE6/7/8浏览器不支持rgba,只有使用IE的专属滤镜f ...

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

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

  7. css 背景透明文字(内容)不透明三种实现方法

    好久没写博客了.以前还想着最少一个月抽空写几篇.结果没做到O(∩_∩)O~~.好吧.现在努力,继续坚持. 看着以前写的东西,感觉自己在逐渐成长. 先上图: 本文主要记录如上图一样的.文字或内容不透明, ...

  8. CSS实现背景透明，文字不透明（各浏览器兼容）

    /*CSS*/.waps{ background:url(07158.bmp) no-repeat top center fixed; width:1004px; text-align:center; ...

  9. 背景透明文字不透明的最佳方法兼容IE(以背景黑色透明度0.5为例)

    以背景黑色,透明度0.5举例为大家详细介绍下关于背景透明,文字不透明的最佳方法同时兼容IE,具体实现如下,感兴趣的朋友可以参考下哈希望对大家有所帮助 以背景黑色,透明度0.5举例 非IE:backgr ...

随机推荐

  1. jquery为多个元素添加事件

    html <c:forEach items="${modellist}" var="model" varStatus="status" ...

  2. PreferenceActivity详解

    为了引入这个概率 首先从需求说起 即:现有某Activity专门用于手机属性设置 那么应该如何做呢? 根据已学知识 很快一个念头闪过 即:Activity + Preference 组合 前者用于界面 ...

  3. linux expr命令参数及用法详解

    expr用法 expr命令一般用于整数值,但也可用于字符串.一般格式为: #expr argument operator argument expr也是一个手工命令行计数器. #$expr 10 + ...

  4. headless

    http://www.oschina.net/translate/using-headless-mode-in-java-se

  5. ant 配置 和测试 1

    配置路径 D:\dba\change\UAT\unity\schema\test ----v0 版本 sql.xml   (默认target 是versionfinal ,也就是最终版本) --ver ...

  6. java中的类修饰符、成员变量修饰符、方法修饰符

    类修饰符:  public(访问控制符),将一个类声明为公共类,他可以被任何对象访问,一个程序的主类必须是公共类. abstract,将一个类声明为抽象类,没有实现的方法,需要子类提供方法实现. fi ...

  7. 【floyd 多源最短路】 poj 1125

    #include <stdio.h> #include <iostream> #include <memory.h> using namespace std; ][ ...

  8. C++ 学习之函数重载、基于const的重载

    函数重载 函数重载的定义是:在相同的作用域中,如果函数具有相同名字而仅仅是形参表不同,此时成为函数重载.注意函数重载不能基于不同的返回值类型进行重载. 注意函数重载中的"形参表"不 ...

  9. Shell命令替换与变量替换

    命令替换 命令替换是指Shell可以先执行命令,将输出结果暂时保存,在适当的地方输出.命令替换的语法: `command` 注意是反引号,不是单引号,这个键位于 Esc 键下方.下面的例子中,将命令执 ...

  10. 利用apache组件实现文件上传

    实现文件上传需要引入: commons-fileupload-1.3.2.jar commons-io-2.5.jar commons-logging-1.2.jar <!DOCTYPE htm ...