opacity:0.5;

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

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

　　　　

　　　　

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. 	<meta charset="UTF-8">
  5. 	<title>Document</title>
  6. 	<style type="text/css">
  7. 		.container{
  8. 			width: 500px;
  9. 			height:378px;
  10. 			margin: 100px auto;
  11. 			position: relative;
  12. 		}
  13.  
  14. 		.container i{
  15. 			width: 500px;
  16. 			height:378px;
  17. 			position: absolute;
  18. 			top: 0px;
  19. 			color:#fff;
  20. 			font-size: 50px;
  21. 			background-color: #000;
  22.  
  23. 			/* 字颜色会变 */
  24. 			/* opacity: 0.4;
  25. 			filter: Alpha(opacity=40); */
  26.  
  27. 			/* 字颜色不会变 */
  28. 			background: transparent;
  29. 			background-color: rgba(0, 0, 0,0.5);
  30. 			filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr=#80000000, endColorstr=#80000000);
  31. 		}
  32. 	</style>
  33. </head>
  34. <body>
  35. 	<div class="container">
  36. 		<i>喵喵喵</i>
  37. 		<img src="a6.jpg">
  38. 	</div>
  39. </body>
  40. </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. Linux 解决 bash ./ 没有那个文件或目录 的方法

    在Debian 或 ubuntu 64位下运行 ./xxx 会跳出来说没有这个文件或者目录,但是ls看又有这个文件,很是奇怪. 其实原因很简单,是因为他没有32位的运行库 ia32-libs ,直接安 ...

  2. Global事件执行顺序

    Global.asax 文件,有时候叫做 ASP.NET 应用程序文件,提供了一种在一个中心位置响应应用程序级或模块级事件的方法.你可以使用这个文件实现应用程序安全性以及其它一些任务.下面让我们详细看 ...

  3. 未能加载文件或程序集“ICSharpCode.SharpZipLib, Version=0.86.0.518, Culture=neutral, PublicKeyToken=1b03e6acf1164f73”或它的某一个依赖项

    未能加载文件或程序集“ICSharpCode.SharpZipLib, Version=0.86.0.518, Culture=neutral, PublicKeyToken=1b03e6acf116 ...

  4. 为PO手写添加配置文件（hbm.xml）

  5. .net获取根目录的方法集合

    编写程序的时候,经常需要用的项目根目录.自己总结如下 .取得控制台应用程序的根目录方法 方法1.Environment.CurrentDirectory 取得或设置当前工作目录的完整限定路径 方法2. ...

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

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

  7. c++内存流

    1.MemoryStream.h文件内容 ifndef _MEM_STREAM_H_ #define _MEM_STREAM_H_ #include <string> class CMem ...

  8. Form类的KeyPreview属性

    首先需要知道一个知识点,Form控件,Panel控件和GroupBox控件等容器类控件默认是不接收焦点的,而是负责管理容器中控件的焦点.当容器控件被选中时,默认把焦点传送至容器内Tab顺序为0的控件. ...

  9. 基础-Ajax，json

    ajax是异步交互,也就是说发送请求,到响应回来,页面只是局部刷新. Ajax 步骤: 获取XMLHttpRequest对象 绑定一个回调函数 open send 在回调函数中完成操作. json是一 ...

  10. 初探JavaScript魅力

    <style> #div1{width:200px; height:200px; background:red;} </style> </head> <scr ...