背景透明IE和rgba
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的更多相关文章
- opacity的背景透明&background中rgba的背景色透明
近期使用css实现了一个loading旋转加载的图片效果,类似gif动画 过程中,需要透明背景,但是图片不要透明 只要背景透明!只要背景透明!只要背景透明! 这里对透明模糊了,两种写法,模糊了 A: ...
- input设置背景透明、placeholder的字体颜色及大小
1.设置input背景透明: background:rgba(255,255,255,0.1); 前面三个参数为对应的rgb数值,第四个参数为透明度:0~1,0:透明,1:不透明: 2.设置input ...
- 通过IE私有滤镜让IE6 7 8支持背景透明,内容不透明效果。
CSS3已经支持背景rgba的rgba透明度,这一方法可以避免元素内容也随背景一起变透明(详情请阅http://www.cssha.com/css3-new-knowledge-student).但是 ...
- 【原】CSS实现背景透明,文字不透明,兼容所有浏览器
11.11是公司成立的日子,16岁啦,我呢3岁半,感谢公司给了这样一个平台,让我得以学习和成长,这里祝愿公司发展越来越好~ 进入主题,每年11月11号是光棍节,产生于校园,本来只是一流传于年轻人的娱乐 ...
- CSS实现背景透明,文字不透明(兼容各浏览器)
在 FF/Chrome 等较新的浏览器中可以使用css属性background- color的rgba轻松实现背景透明,而文字保持不透明.而IE6/7/8浏览器不支持rgba,只有使用IE的专属滤镜f ...
- CSS实现背景透明,文字不透明,兼容所有浏览器
11.11是公司成立的日子,16岁啦,我呢3岁半,感谢公司给了这样一个平台,让我得以学习和成长,这里祝愿公司发展越来越好~ 进入主题,每年11月11号是光棍节,产生于校园,本来只是一流传于年轻人的娱乐 ...
- css 背景透明文字(内容)不透明三种实现方法
好久没写博客了.以前还想着最少一个月抽空写几篇.结果没做到O(∩_∩)O~~.好吧.现在努力,继续坚持. 看着以前写的东西,感觉自己在逐渐成长. 先上图: 本文主要记录如上图一样的.文字或内容不透明, ...
- CSS实现背景透明,文字不透明(各浏览器兼容)
/*CSS*/.waps{ background:url(07158.bmp) no-repeat top center fixed; width:1004px; text-align:center; ...
- 背景透明文字不透明的最佳方法兼容IE(以背景黑色透明度0.5为例)
以背景黑色,透明度0.5举例为大家详细介绍下关于背景透明,文字不透明的最佳方法同时兼容IE,具体实现如下,感兴趣的朋友可以参考下哈希望对大家有所帮助 以背景黑色,透明度0.5举例 非IE:backgr ...
随机推荐
- IT人为什么难以拿到高薪?【转帖】
最近在论坛里看到很多人发牢骚,说薪水少,可在我看来,你们这样的人拿得到高薪才怪! 我先问一句:这里有多少人是本科的?有多少人是正规本科的(不算自考,成考和专升本)?有多少人是有学位的?有多少有学位的是 ...
- 昨天上架出现问题,you binary is not optimized for iphone5.。。。。
这个时候只需要加一个lanuch image 就可以了
- 拓扑序+dp Codeforces Round #374 (Div. 2) C
http://codeforces.com/contest/721/problem/C 题目大意:给你有向路,每条路都有一个权值t,你从1走到n,最多花费不能超过T,问在T时间内最多能访问多少城市? ...
- javascript string去除两边空格
function trim(){ return this.replace(/(^\s*)|(\s*$)/g,""); g整个字符串 }
- document.querySelectorAll遍历(forEach小解)
document.querySelectorAll兼容性良好,在之前的项目中就其遍历方式出了错误,先做个小结: 1.for循环 传统遍历方法 for(var i= 0; i< document. ...
- OpenGL红宝书第一个例子:绘制两个三角形
1. 环境配置 在这里不在做环境配置的说明,因为网上可以找到很多类似的教程,如果有需要可以@我,我也希望能帮到大家,其它的不说了,先上我的代码 2. 第一个程序代码 创建LoadShader.h #p ...
- 怎样解决VS2013模块对于SAFESEH 映像是不安全的
今天在使用VS2013编译一个控制台应用程序时出现了:error LNK2026 模块对于 SAFESEH 映像是不安全的,按照以下步骤轻松解决了. 打开该项目的“属性页”对话框,然后单击“链接器”- ...
- skia入门
SkBitmap bmp; bmp.setConfig(SkBitmap::kARGB_8888_Config, rect.Width(), rect.Height()); bmp.allocPixe ...
- JDBC连接(MySql)数据库步骤,以及查询、插入、删除、更新等十一个处理数据库信息的功能
主要内容: JDBC连接数据库步骤. 一个简单详细的查询数据的例子. 封装连接数据库,释放数据库连接方法. 实现查询,插入,删除,更新等十一个处理数据库信息的功能.(包括事务处理,批量更新等) 把十 ...
- UVALive 2035 The Monocycle(BFS状态处理+优先队列)
这道题目真是非常坎坷啊,WA了很多次,但所有的思路都是奔着广搜去想的,一开始出现了比答案大的数据,才想到了应该是优先队列,再说加上也肯定不会错.一开始我读错了题意,以为旋转并且前行需要的时间跟其他一样 ...