利用CSS实现半透明效果兼容IE与火狐与chrome等浏览器
直接上代码，兼容IE,firefox,chrome,Safari,Opera等主流浏览器的半透明CSS代码：
filter:alpha(opacity=50);
opacity: 0.5;
-moz-opacity:0.5;
几个属性的意思是：
opacity: 0.5; CSS的标准，支持chrome,firefox, Safari和 Opera，取值范围0-1。
filter:alpha(opacity=50); 这个是为IE设的，取值范围0-100。
-moz-opacity:0.5; 支持老版本的Mozilla，取值范围0-1。
-khtml-opacity: 0.5; 支持老版本的Safari浏览器，取值范围0-1。
以下是测试代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>利用CSS实现半透明效果兼容IE与火狐与chrome等浏览器</title>
</head>
<body style="background:#09f;">
<div class="tm_fontzhi">通过CSS实现半透明，兼容IE,firefox,chrome等主流浏览器</div>
<div class="tm_fontbg"></div>
<style>
.tm_fontbg {
position:absolute;top:50px;right:50px;bottom:50px;left:50px;background:#000;z-index:99; /* 这段代码是为了实现div固定位置的不用在意这段 */
filter:alpha(opacity=50); /* 这个是为IE设的，取值范围0-100。 */
opacity: 0.5; /* CSS的标准，支持chrome,firefox, Safari和 Opera，取值范围0-1。 */
-moz-opacity:0.5; /* 支持老版本的Mozilla，取值范围0-1。 */
-khtml-opacity: 0.5; /* 支持老版本的Safari浏览器，取值范围0-1。 */
}
.tm_fontzhi {position:absolute;top:90px;right:90px;bottom:90px;left:90px;padding:0 20px;color:#fff;z-index:100;}
</style>
</body>
</html>
filter:alpha(opacity=50);
opacity: 0.5;
-moz-opacity:0.5;
几个属性的意思是：
opacity: 0.5; CSS的标准，支持chrome,firefox, Safari和 Opera，取值范围0-1。
filter:alpha(opacity=50); 这个是为IE设的，取值范围0-100。
-moz-opacity:0.5; 支持老版本的Mozilla，取值范围0-1。
-khtml-opacity: 0.5; 支持老版本的Safari浏览器，取值范围0-1。
以下是测试代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>利用CSS实现半透明效果兼容IE与火狐与chrome等浏览器</title>
</head>
<body style="background:#09f;">
<div class="tm_fontzhi">通过CSS实现半透明，兼容IE,firefox,chrome等主流浏览器</div>
<div class="tm_fontbg"></div>
<style>
.tm_fontbg {
position:absolute;top:50px;right:50px;bottom:50px;left:50px;background:#000;z-index:99; /* 这段代码是为了实现div固定位置的不用在意这段 */
filter:alpha(opacity=50); /* 这个是为IE设的，取值范围0-100。 */
opacity: 0.5; /* CSS的标准，支持chrome,firefox, Safari和 Opera，取值范围0-1。 */
-moz-opacity:0.5; /* 支持老版本的Mozilla，取值范围0-1。 */
-khtml-opacity: 0.5; /* 支持老版本的Safari浏览器，取值范围0-1。 */
}
.tm_fontzhi {position:absolute;top:90px;right:90px;bottom:90px;left:90px;padding:0 20px;color:#fff;z-index:100;}
</style>
</body>
</html>
后一页：没有了
- 相关阅读
- ( 2019/4/16 15:23:47 )jquery动态生成的html代码中无法使用jquery事件的解决方法
- ( 2019/4/16 14:40:46 )asp实现获得当前文章的上一篇信息与下一篇信息功能及代码
- ( 2019/4/16 14:29:04 )asp导出内容到excel表并自定义命名后下载（非打开）
- ( 2019/4/16 11:31:00 )'禁止站外提交页面和数据
- ( 2019/4/16 11:19:50 )asp将中文汉字字符转为unicode编码(\u编码)与把unicode编码转为汉字
- ( 2019/4/15 22:32:46 )asp中qequest读取优先级顺序（通过优化之后提高速度）
- ( 2019/4/15 22:07:57 )asp计算页面执行时间显示到毫秒
- ( 2019/4/9 13:50:50 )国内网站常用的一些 CDN 静态资源公共库加速服务
- 共有0条关于《利用CSS实现半透明效果兼容IE与火狐与chrome等浏览器》的评论
- 发表评论
正在加载评论……
返回顶部发表评论
深山工作室网友评论声明，请自觉遵守互联网相关政策法规。
您发布的评论即表示同意遵守以下条款：
一、不得利用本站危害国家安全、泄露国家秘密，不得侵犯国家、社会、集体和公民的合法权益；
二、不得发布国家法律、法规明令禁止的内容；互相尊重，对自己在本站的言论和行为负责；
三、本站对您所发布内容拥有处置权。
- 更多>>同类信息
- 在table中tr的display:block在firefox下显示布局错乱问题
- 在未知图片的宽度与高度时利用div+css将图片居中
- 用css做的英文首字母大写和英文全都大写通过各个浏览器
- css优先级的例子
- 让DIV固定在浏览器窗口的底部（兼容IE6）
- MarkMan 马克鳗，让设计更有爱 (超级给力的页面标注工具)
- IE8 CSS HACK 兼容
- IE6不支持png24的解决办法(png24做为css的背景)
苏公网安备 32070502010230号