注册

CSS设置透明度的方法(兼容目前所有主流浏览器)

嗨豆壳技术文章 时间:2014-09-05 16:56:06 [ray]

BS前端开发中,常用到弹出层。而弹出层通常都设置成半透明,那么这个CSS半透明度是如何设置的呢?又如何兼容各大主流浏览器呢?

废话不多说,直接上代码,如下:

.transparent_class {
    filter:alpha(opacity=50);
    -moz-opacity:0.5;
    -khtml-opacity: 0.5;
    opacity: 0.5;
} 

这里解释下每条样式具体的作用。

opacity: 0.5; 

这条是“最重要的”,因为它是CSS现行标准。该写法在火狐(Firefox)、苹果浏览器(Safari)、谷歌(Chrome)和欧朋(Opera)的大多数版本有效。当然,一些比较旧的版本除外。

filter:alpha(opacity=50);

这条是旧版本IE特有的样式写法,万恶的IE啊。9+版本IE已经使用CSS现行标准写法。

-moz-opacity:0.5;

兼容老版本的Mozilla核心浏览器,比如Netscape Navigator。

-khtml-opacity: 0.5;

兼容老版本的Safari,Safari(1.x)的渲染引擎是使用kthml,而不是目前的WebKit。

标签

本文地址:https://www.hi-docs.com/article/75.html

上一篇:PHP获取URL地址中带#号等特殊符号参数的方法

下一篇:百度免费IP地址查询API,查询接口