CSS3中的Opacity多浏览器透明度兼容性问题

2024-06-24 11:03:30阅读量:35 字体:

用来设定元素透明度的 Opacity 是CSS 3里的一个属性。当然现在还只有少部分浏览器支持。不过各个浏览器都有自己的私有属性来支持,其中包括老版本的Mozilla和Safari:

IE: filter:alpha(opacity)
Mozilla: -moz-opacity
Safari: -khtml-opacity

很不幸的是,你没看见Opera,老版本的Opera并没有什么私有属性可以代替opacity。(新版Opera已经支持opacity)

所以以前用CSS设定一个元素半透明的话,可能会这样写:

CSS3中的Opacity多浏览器透明度兼容性问题

用javascript来设定一个元素为半透明:

下面给大家介绍css透明度的设置 (兼容所有浏览器)

一句话搞定透明背景!

Here is what each of those CSS properties is for:

opacity: 0.5; This is the “most important” one because it is the current standard in CSS. This will work in most versions of Firefox, Safari, and Opera. This would be all you need if all browsers supported current standards. Which, of course, they don’t.
filter:alpha(opacity=50); This one you need for IE.
-moz-opacity:0.5; You need this one to support way old school versions of the Mozilla browsers like Netscape Navigator.
-khtml-opacity: 0.5; This is for way old versions of Safari (1.x) when the rendering engine it was using was still referred to as KTHML, as opposed to the current WebKit .


推荐阅读

  • 微信注销后聊天记录还能恢复吗

    微信注销后聊天记录还能恢复吗

    如果对聊天记录进行备份或迁移的话,微信注销后聊天记录可以恢复。如果没有对聊天记录进行备份或迁移的话,微信注销后聊天记录无法恢复。以下是注销微信的操作步骤: 微信注销后聊天记录还能恢复吗 1、打开微信A...

    阅读: 757

  • 微信群太多怎么实现分组管理

    微信群太多怎么实现分组管理

    微信群太多可以使用折叠群的功能进行分组管理,将群设置为折叠群的具体操作步骤如下: 微信群太多怎么实现分组管理 1、打开微信app,点击下方的通讯录,再点击群聊进入群聊界面。 2、进入群聊界面后,选择...

    阅读: 737

  • 微信预约挂号怎样切换就诊人

    微信预约挂号怎样切换就诊人

    以梧州市中医院公众号为例,在梧州市中医院微信公众号预约挂号切换就诊人的具体操作步骤如下: 微信预约挂号怎样切换就诊人 1、打开微信APP,搜索梧州市中医院公众号”,点击该公众号,再点击发消...

    阅读: 715

  • 快手别人怎么关注不了我

    快手别人怎么关注不了我

    如果别人关注不了你的快手账号的话,可能是你开启了隐私用户”,关闭隐私账户”的具体操作方式如下: 快手别人怎么关注不了我 1、打开快手,点击左上角的三条横线”,进入功...

    阅读: 748

  • 微信一打就是对方忙是不是设置了

    微信一打就是对方忙是不是设置了

    微信一打就是对方忙不是设置了,因为无法设置。打微信电话提示对方忙”有以下两种情况:1、对方在忙线,正在与别人打微信或者视频电话。2、对方不想接听电话,选择挂断。以下是拨打微信语音电话的具体...

    阅读: 641

  • 怎么约顺风车

    怎么约顺风车

    顺风车是在21世纪比较流行的词语,是指搭便车、顺路车、拼车的意思。以下是约顺风车的具体操作方法: 怎么约顺风车 1、打开微信,点击我”-服务”-滴滴出行”,进入该界...

    阅读: 663